jQuery的選擇器與innerHtml或innerText或textContent

我寫了一個簡單的頁面，檢查是否有人輸入正確的電子郵件兩次。我想在頁面的另一個元素中顯示天氣與否，第二個表單塊中的電子郵件與第一個表單中的電子郵件相同。我正在使用jquery id選擇器。jQuery的選擇器與innerHtml或innerText或textContent

<head> 
<script type="text/javascript" src="jquery1.8.3-min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript"> 


    function emailCheck(){ 
     if($("#email").val() != $("#email2").val()) 
     { 
      $("#err").innerText = "emails don't match, sucka"; 
      $("#test").textContent = "emails don't match, sucka"; 
      $("#test2").innerHtml = "emails don't match, sucka"; 
      document.getElementById("getEleTest").innerText = "emails don't match, sucka"; 
      alert("dont match"); 
     } 
    } 
</script> 
</head> 

<body> 
<form action="SignUp" method="POST"> 
    <table> 
     <label for="email">Email</label></br> 
     <input id="email" type ="email" name="email1111"/> </br> 
     <label for="email2" > Enter Email Again </label></br> 
     <input id="email2" type="email" name="email21111" onkeyup="emailCheck();"></br> 
     <input type="submit" value="Sign Up"> 
    </table> 
</form> 

<div id="err"></div> 
<div id="test"></div> 
<div id="test2"></div> 
<div id="getEleTest"></div> 
</body>

在任何情況下，我沒有收到我錯了，測試，和TEST2元素的元素任何文字，但我得到一個警告窗口，並沒有在getEleTest元素的文本。這裏會發生什麼。我沒有在螢火蟲控制檯中發現任何錯誤，jquery得到'email'和'email2'元素。我檢查了我正確鏈接jquery腳本，以防萬一我沒有添加谷歌jquery源代碼。由於

來源

2012-11-23 decapo

如何圍繞jQuery的東西，一個DOM準備功能，使其工作，並停止使用內聯JS，喜歡的onclick功能？ – adeneo

你會用什麼來代替內聯JS？我仍然是一個新手。 – decapo

我編輯了我的答案，告訴你如何寫它，所以你不使用內聯JS。 – ttkalec

把所有的jQuery的東西在$(document).ready(function(){ //your code here });

編輯2：我在我的JS代碼一個錯字。您正在將常規JS與jQuery混合使用。

爲什麼不寫這樣的東西？

$(document).ready(function(){ 
    $("#signUpForm").submit(function(evt){ 
     if($("#email").val() != $("#email2").val()){ 
      $("#err").html("emails don't match, sucka"); 
      $("#test").html("emails don't match, sucka"); 
      $("#test2").html("emails don't match, sucka"); 
      $("#getEleTest").html("emails don't match, sucka"); 
      alert("dont match"); 
      evt.preventDefault(); 
     }; 
    }); 
});

and add id =「signUpForm」atribute to form？你也需要從你的HTML中刪除內聯JS，這樣你的輸入沒有onKeyUp事件。
你可以看我的例子here。

來源

2012-11-23 19:12:34 ttkalec

不是 - 只適用於在頁面加載時運行的代碼。即：「文檔準備就緒」 – Curt

@Curt是的，我剛剛看到。另外，你爲什麼要兩次引用jQuery？ – ttkalec

你在jQuery包裝器上設置'innerText'和其他屬性，而不是DOM元素本身... – Dennis

它的值應爲：

document.getElementById("id").textContent = "string";

或

$("#id").text("string");

確保你不將二者結合起來，或者你不會得到預期的結果。

來源

2012-11-23 19:14:41 Dennis

寫你這樣的代碼我有測試它在我的機器上

<script type="text/javascript"> 
    function emailCheck(){ 
     if($("#email").val() != $("#email2").val()) 
     { 
      $("#err").html("emails don't match, sucka"); 
      $("#test").html("emails don't match, sucka"); 
      $("#test2").html("emails don't match, sucka"); 

      document.getElementById("getEleTest").innerText = "emails don't match, sucka"; 
      //alert("dont match"); 
     } 
    } 
</script>

來源

2012-11-23 19:21:49

所有的答案都是正確的部分。您必須將代碼包裝在$（document）.ready函數中，然後使用jQuery事件，而不是內聯函數。問題在於onkeyup在jQuery調用中無法正常工作，因爲這些在函數範圍內調用。我認爲emailCheck函數根本沒有被調用。取下的onkeyup和嘗試這一點，並從那裏工作：

$(document).ready(function(){ 
    $('#email2').keyup(function() { 
    alert("test"); 
    }); 
});

來源

2012-11-23 19:43:46

我使用$（「＃email2」）。bind（'keyup'，function emailCheck（）{// code} – decapo

jQuery的選擇器與innerHtml或innerText或textContent

回答

相關問題