Javascript：禁用textfield不起作用

我試着編寫一些JavaScript的形式，當用戶輸入某個單詞，然後下面的textfield會自動disable.The問題是，當我嘗試在jsfiddle代碼將運行順利，但是當我在我的項目中使用它時，它不起作用。任何人都可以解釋我的代碼有什麼問題。Javascript：禁用textfield不起作用

<script> 
function matchWord(e){ 
if(document.getElementById('uname').value.trim === 'Unknown' || document.getElementById('uname').value.trim === 'unknown'){ 
    document.getElementById('pword').disabled = true; 
    document.getElementById('response').disabled = true; 
    alert('you enter bannned name in the field'); 
} 
else{ 
} 
} 
document.getElementById('uname').onkeyup = matchWord(); 
</script> 

<html> 
    <body> 
     Name:<input type="text" name="uname" id="uname" placeholder="Username"><br> 
     password:<input type="password" name='pword' id='pword' placeholder="password"><br> 
     Responsibility:<select id = "response"> 
        <option>---Responsibility---</option> 
         </select> 
    </body> 
</html>

來源

2017-03-08 Nexz

錯字：'函數matchWord'（駝峯）VS'=速配關鍵字'（小寫）。 –

只是修復它，但仍然無法正常工作。 – Nexz

您是否檢查過瀏覽器的devtools錯誤？一個可能的解釋是「[爲什麼jQuery或諸如getElementById之類的DOM方法未找到該元素？]（https://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method - as-getelementbyid-not-the-element）「 –

Below code works fine for me in all browsers 

<html> 
    <body> 
     Name:<input type="text" name="uname" id="uname" placeholder="Username"><br> 
     password:<input type="password" name='pword' id='pword' placeholder="password"><br> 
     Responsibility:<select id = "response"> 
        <option>---Responsibility---</option> 
         </select> 
    </body> 
    <script> 
function matchWord(e){ 
if(document.getElementById('uname').value.trim() === 'Unknown' || document.getElementById('uname').value.trim() === 'unknown'){ 
    document.getElementById('pword').disabled = true; 
    document.getElementById('response').disabled = true; 
    alert('you enter bannned name in the field'); 
} 
else{ 
} 
} 
document.getElementById('uname').addEventListener("keyup", function(evt) { 
     matchWord(evt); 
    }, false); 
</script> 
</html>

來源

2017-03-08 07:23:44

提示：嘗試至少包括一個簡短說明和一個片段，詳細說明與問題片段有什麼不同以及爲什麼您認爲修訂是必要的。 –

謝謝，你的代碼適合我。 – Nexz

要設置爲eventhanlder KeyUp事件中的作用的結果，而你要設置的功能本身。

嘗試：

document.getElementById('uname').onkeyup = matchWord;

相反，或者添加在元件本身的事件處理程序，除去前一行和添加：

<input type="text" name="uname" id="uname" placeholder="Username" onkeyup="matchWord()">

來源

2017-03-08 07:22:02 Juan

問題1：錯字matchword()，將其替換爲matchWord();

問題2：修剪是一種方法！改爲使用document.getElementById('uname').value.trim()。

function matchWord(e) { 
 
    if (document.getElementById('uname').value.trim() === 'Unknown' || document.getElementById('uname').value.trim() === 'unknown') { 
 
    document.getElementById('pword').disabled = true; 
 
    document.getElementById('response').disabled = true; 
 
    alert('you enter bannned name in the field'); 
 
    } 
 
}

Name: 
 
<input type="text" name="uname" id="uname" placeholder="Username" onkeyup="matchWord()"> 
 
<br> password: 
 
<input type="password" name='pword' id='pword' placeholder="password"> 
 
<br> Responsibility: 
 
<select id="response"> 
 
    <option>---Responsibility---</option> 
 
</select>

來源

2017-03-08 07:24:26

首先trim()不是屬性，其的方法。所以，您需要將其從trim更改爲trim()。

第二個您需要爲onkeyup指定一個函數，而不是調用函數。

function matchWord(e) { 
 
    if (document.getElementById('uname').value.trim() === 'Unknown' || document.getElementById('uname').value.trim === 'unknown') { 
 
     document.getElementById('pword').disabled = true; 
 
     document.getElementById('response').disabled = true; 
 
     alert('you enter bannned name in the field'); 
 
    } else {} 
 
} 
 
document.getElementById('uname').onkeyup = matchWord;

Name:<input type="text" name="uname" id="uname" placeholder="Username"><br> 
 
password:<input type="password" name='pword' id='pword' placeholder="password"><br> 
 
Responsibility: 
 
<select id = "response"> 
 
<option>---Responsibility---</option> 
 
</select>

來源

2017-03-08 07:24:37 m87

有您提供的樣本中的幾個誤區。

首先，名稱區分大小寫，所以matchWord不等於matchword。小心！
其次，您需要使用document.getElementById('uname').onkeyup = matchWord;將函數本身分配給事件，而不是它返回的結果。
第三點也是最後一點，您的方法中的邏輯錯誤，因爲您使用的是trim而不是trim()，這與上面提到的錯誤完全相反，它返回的是函數而不是值。下面的代碼片段工作：

function matchWord(e) { 
 
    if (document.getElementById('uname').value.trim() === 'Unknown' || 
 
    document.getElementById('uname').value.trim() === 'unknown') { 
 
    document.getElementById('pword').disabled = true; 
 
    document.getElementById('response').disabled = true; 
 
    alert('you enter bannned name in the field'); 
 
    } else {} 
 
} 
 

 
document.getElementById('uname').onkeyup = matchWord;

Name:<input type="text" name="uname" id="uname" placeholder="Username"><br> password: 
 
<input type="password" name='pword' id='pword' placeholder="password"><br> Responsibility: 
 
<select id="response"> 
 
<option>---Responsibility---</option> 
 
</select>

來源

2017-03-08 07:25:03

仍然失敗，我認爲問題來自我的瀏覽器。但還是謝謝。 – Nexz

@Nexz你在瀏覽什麼？這應該在任何現代瀏覽器中都能很好地工作...... –

沒關係，我找到了下面的答案。但是，我同時使用chrome和firefox.thanks。 – Nexz

地說：

<script> // stuff </script>

在：

<html> // here </script>

來源

2017-03-08 07:25:08

Javascript：禁用textfield不起作用

回答

相關問題