第二個輸入標籤 - 我如何添加？

如何在第二個輸入中插入Javascript代碼？第二個輸入標籤 - 我如何添加？

<input type="checkbox" onchange="document.getElementById('pass').type = this.checked ? 'text' : 'password'"> Show password

原始代碼：

document.getElementById('pass').type

好，工作，但..

document.getElementById('pass' 'pass2').type

第二個「PASS2」我該怎麼補充？

對不起，我英文不好

來源

2012-07-22 Emre Saracoglu

你不能這樣做，你必須爲其他元素執行相同的一段代碼。即你必須調用'document.getElementById'並且分配兩次（你也可以創建一個封裝這個邏輯的函數）。如果不使用HTML屬性來綁定事件處理程序，那將更容易。查看http://www.quirksmode.org/js/introevents.html以瞭解綁定事件處理程序的各種方法。 – 2012-07-22 15:47:14

@JaredFarrish：看看那之後的部分......它是條件運算符的一部分。 – Ryan 2012-07-22 15:52:43

@Jared：看起來沒什麼好，它似乎切換明文/隱藏密碼。但我隱約記得，IE不會讓你改變類型...不知道。 – 2012-07-22 15:52:43

這是不可能的，只是叫getElementById兩次，最好用一個真實的事件處理函數。

function togglePasswordVisibility() { 
    if(this.checked) { 
     document.getElementById('pass').type = 'text'; 
     document.getElementById('pass2').type = 'text'; 
    } else { 
     document.getElementById('pass').type = 'password'; 
     document.getElementById('pass2').type = 'password'; 
    } 
}

另外請注意，您的代碼將無法在Internet Explorer 8和更早（我認爲這是正確的版本號），因爲它修復type的元素添加到文檔後。

來源

2012-07-22 15:50:31 Ryan

測試：http://jsfiddle.net/AaRUS/適用於IE9;檢查IE8及以下。編輯：IE8，不起作用。 – 2012-07-22 16:01:30

它在IE8中似乎也不能使用jQuery的'$ .prop（）'或'$ .attr（）'。 – 2012-07-22 16:04:53

@JaredFarrish：嗯，jQuery的'prop'和'attr'只是委託給'[]'和'.setAttribute'，所以我並不感到驚訝。克隆它是凌亂的，並打破事件處理程序，所以我認爲最好將這個功能放在IE8及更早的版本上。 – Ryan 2012-07-22 16:29:44

你不能這樣做沒有環或複製使用香草DOM功能粘貼。我要麼使用jQuery，要麼將該行變成一個函數，然後可以在變化時調用該函數。

jQuery的等價：

$('#toggle-pass').click(function() { 
    $('#pass, #pass2').prop('type', this.checked ? 'text' : 'password'); 
});

<label><input type="checkbox" id="toggle-pass" /> Show password</label>

來源

2012-07-22 15:49:26 mogelbrod

第二個輸入標籤 - 我如何添加？

回答

相關問題