كيفية الحصول على بيانات من html باستخدام جافاسكريبت

هل يمكنك مشاركة الكود الذي تقوم عن طريقه بأخذ القيم من ال form؟

وعليكم السلام

جربت الكود الخاص بك، القيمة في الinput تتغير بشكل طبيعي، قم بإضاحة المشكلة بشكل أكبر لنستطيع مساعدتك

بتاريخ 49 دقائق مضت قال معاذ قره محمد:

وعليكم السلام

جربت الكود الخاص بك، القيمة في الinput تتغير بشكل طبيعي، قم بإضاحة المشكلة بشكل أكبر لنستطيع مساعدتك

نعم القيمة تتغير ولكن لايمكن الحصول عليها في متغير

مثلا:

const sub = document.querySelector("input[type='submit']");

function makeGrid() {

  const gridHeight = document.getElementById("inputHeight").value;

  console.log(gridHeight);

}

sub.addEventListener('click',makeGrid());

اذا غيرت القيمة في الinput لن تحصل إلا علي ال default value وهي 1

بتاريخ 10 دقائق مضت قال Ahmed Soliman12:

نعم القيمة تتغير ولكن لايمكن الحصول عليها في متغير

مثلا:

const sub = document.querySelector("input[type='submit']");

function makeGrid() {

  const gridHeight = document.getElementById("inputHeight").value;

  console.log(gridHeight);

}

sub.addEventListener('click',makeGrid());

اذا غيرت القيمة في الinput لن تحصل إلا علي ال default value وهي 1

أخي كل ما عليك حذف الأقواس عند دالة makeGrid داخل الaddEventListener:

sub.addEventListener("click", makeGrid)

في حال وضعت الأقواس ستنفذ الطريقة لمرة واحدة فقط عند بدء البرنامج. لأن وضع الأقواس يكون لاستدعاء الطريقة وتنفيذها، أما هنا نحن نريد مرجع الطريقة في الذاكرة دون تنفيذها لأن التنفيذ سيتم عند النقر فقط.

بتاريخ 14 دقائق مضت قال Ahmed Soliman12:

نعم القيمة تتغير ولكن لايمكن الحصول عليها في متغير

مثلا:

const sub = document.querySelector("input[type='submit']");

function makeGrid() {

  const gridHeight = document.getElementById("inputHeight").value;

  console.log(gridHeight);

}

sub.addEventListener('click',makeGrid());

اذا غيرت القيمة في الinput لن تحصل إلا علي ال default value وهي 1

إن الخطأ هو في التابع الذي تقوم بتمريره إلى ال addEventListener حيث أنك تقوم باستدعاء التابع و ليس القيام بتمرير اسمه فقط.

عليك فقط القيام بتمرير التابع.

أي أننا في هذه الطريقة نقوم بتمرير اسم التابع حتى يعرف ما الذي يجب تنفيذه عند حدوث ال event و هو يقوم بتنفيذ التابع عند حدوثه و بالتالي تكون القيمة المناسبة موجودة في مكون ال html.

بينما في حال استدعينا التابع فوراً فسيأخذ القيمة الافتراضية تلقائياً و لن يقوم بتحديث شيء.

بتاريخ 25 دقائق مضت قال Kais Hasan:

إن الخطأ هو في التابع الذي تقوم بتمريره إلى ال addEventListener حيث أنك تقوم باستدعاء التابع و ليس القيام بتمرير اسمه فقط.

عليك فقط القيام بتمرير التابع.

هذا حل المشكلة ولكن الرقم يظهر ويختفي في ال console

بتاريخ On 9/12/2022 at 17:48 قال Ahmed Soliman12:

هذا حل المشكلة ولكن الرقم يظهر ويختفي في ال console

لو تزوّدنا بصور مشكلتك والكود المستخدم كما هو سنستطيع مساعدتك بشكل أكبر.

بتاريخ 8 ساعات قال معاذ قره محمد:

لو تزوّدنا بصور مشكلتك والكود المستخدم كما هو سنستطيع مساعدتك بشكل أكبر.

شكرا لك حلت المشكلة وحلها كان event.preventDefault