مشكلة جافا سكريبت DOM

برمجة

2023.12.14

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

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

كود أتش تي أم أل:

<pre>
<form>
    <input type="text" placeholder="name" autocomplete="off" onkeyup="full()" id="fname">
</form>
 <p id="p"></p>

هذا هو رمز js الخاص بي.

جافا سكريبت

var name = document.getElementById("fname");
var p = document.getElementById("p");
              function full(){
                if (name.value) {
                    p.innerHTML = "hello, ${name.value}";
                    console.log(1);
                }
                else {
                    p.innerHTML = "hello, who";
                    console.log(2);
                }
              }

ما حاولت:

لقد غيرت الحدث من oninput إلى onkeyup، ولكن حصلت على نفس النتيجة.

الحل 1

المشكلة الأولى هي أنك تستخدم سلسلة عادية بدلاً من سلسلة قالب حرفي[^].

المشكلة الثانية هي ذلك name هو عقار على window هدف. عندما يتم استدعاء وظيفة معالج الأحداث، تقوم هذه الخاصية بإخفاء name عامل. تغيير المتغير الخاص بك إلى شيء من هذا القبيل fname بدلاً من.

جافا سكريبت

const fname = document.getElementById("fname");
const p = document.getElementById("p");

function full() {
    if (fname.value) {
        p.innerHTML = `hello, ${fname.value}`;
    } else {
        p.innerHTML = "hello, who";
    }
}

تجريبي[^]