jQuery選擇器只選擇第一個元素

我有一個關於使用jQuery的小問題。我有以下代碼：jQuery選擇器只選擇第一個元素

<html> 
<head> 

    <script src="jquery/jquery.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     $("form").submit(function(){ 
     if(!$(':text').val()){ 
     $("span").text("sdfgsd").show(); 

     };return false; 
     }) 
     }); 
    </script> 
</head> 
<body> 
    <form action="" id="ff" > 
     <span></span> 
     <input type="text" name="test" /> <br /> 
     <input type="text" name="test3" /> <br /> 
     <input type="checkbox" name="test2" /> <br /> 
     <input type="submit" value="push it" /> 
    </form> 

</body>

的問題是，所述選擇器被激活僅用於第一文本框。如果您在第一個文本框中輸入一個值，則觸發器不會被激活。既不：文本或：輸入正常工作。

有沒有人有任何想法？

thanx提前， denisr

來源

2011-03-20 denisr

我建議你做這樣的事情：

<html> 
<head> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#ff").submit(function(e) { 
       $('.text-input').each(function() { 
        if ($(this).val() == '') { 
         $("#msg").text("sdfgsd"); 
         e.preventDefault(); 
         return false; 
        } 
       }); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <form method="post" action="" id="ff"> 
     <span id="msg"></span> 
     <input type="text" class="text-input" name="test" /> <br /> 
     <input type="text" class="text-input" name="test3" /> <br /> 
     <input type="checkbox" name="test2" /> <br /> 
     <input type="submit" value="push it" /> 
    </form> 
</body> 
</html>

嘗試使用盡可能多地使用id或class屬性來訪問元素，因爲它更高效且不易出錯
使用e.preventDefault()提交表單
使用return false;，防止走出each循環馬上

來源

2011-03-20 19:43:57

上jQuery選擇多於一個的元件匹配的val()函數返回匹配的第一個元素的值。您需要遍歷所有元素並檢查每個元素的值。

$(document).ready(function(){ 
    $("form").submit(function(){ 
    var inputsHaveValues = true; 
    $(':text').each(function() { 
     if (!$(this).val()) { 
      inputsHaveValues = false; 
      break; 
     } 
    }); 

    if (!inputsHaveValues) { 
     $("span").text("sdfgsd").show(); 
     return false; 
    } 
    }) 
});

來源

2011-03-20 19:33:01 tvanfosson

嘗試定義一個應用於每個文本的類，定義一個表單ID或每個使用jQuery。另外，檢查JavaScript錯誤。

http://api.jquery.com/jQuery.each/

來源

2011-03-20 19:33:13 Ryre

val是破壞性方法（你可以在將其不鏈），所以當與在它的許多元件應用於對象，必須返回一個值，其將用於做首先。

您應該看看each方法遍歷所有文本字段。

$('input:text').each(function(index, elm) { 
    if(!$(this).val()){ 
    $("span").text("sdfgsd").show(); 
    }; 
});

你可以使用索引來識別在一個特定的span顯示錯誤消息。所有的

來源

2011-03-20 19:34:28 dianovich

$(document).ready(function(){ 
    $("#ff").submit(function(event){ 
     $('input[type="text"]').each(function() { 
      if(!$(this).val()){ 
       $("span").text("Foobar"); 
      } 
     }); 
     event.preventDefault(); 
    }) 
});

首先請使用 event.preventDefault();其備受比return false;更好。
使用ID - $(#ff) - 即刻的只有$('form')。
使用input[type="text"]即時的唯一:text
使用.each() - 像有些人我上面說的

來源

2011-03-20 19:39:59 mrzmyr

，你爲什麼不想文本設置爲'span'每一個文字輸入是空的，你可以使用一個標誌並將其設置一次。 – 2011-03-20 19:43:09

@LiLivingston它僅用於這個例子:) – mrzmyr 2011-03-20 19:48:53

@Lilivingston - 嗨，因爲m0提到的僅僅是一個例子。我正在努力學習，我可以學習的唯一途徑就是通過練習...... – denisr 2011-03-20 20:10:40

jQuery選擇器只選擇第一個元素

回答

相關問題