jQuery event.preventDefault混淆

-1

我正在使用jQuery。jQuery event.preventDefault混淆

在點擊搜索按鈕使用標誌，檢查是否是單選框選中，它會顯示alert("enter the field")否則做任務......而且我以前event.preventDefault();

這裏其實我使用的單選按鈕在我用包含兩個選項男性和女性的性別標籤。現在的問題是，當我檢查男性單選按鈕或女性。它仍然顯示進入領域。我覺得一定有什麼錯在這部分if($('#gender').is(":not(:checked)"))

這裏是我的代碼：

$('#searchbutton').click(function(event){ 

    alert("ZZ"); 

    var flag3=0; 
    if ($('#gender').is(":not(:checked)")) 
    { 
     flag3=1; 
    } 
    if(flag3==1) 
     alert("Select the field first"); 
    event.preventDefault(); 

}); 

<input type="radio" name="gender" id="gender" value="male" /> Male<br /> 
<input type="radio" name="gender" id="gender" value="female" /> Female 
<input type="submit" name="searchbutton" value="Search" id="searchbutton">

來源

2011-04-19 gur

你在你的代碼的幾個問題。

ID只能在HTML文檔中使用一次。您使用了兩次#gender。
您不需要使用另一個標誌變量，您可以簡單地運行if。
在你的第二個if你沒有使用{}括號，因此preventDefault總是執行。

我建議你做這樣的事情：

<input type="radio" name="gender" value="male" /> Male<br /> 
<input type="radio" name="gender" value="female" /> Female 
<input type="submit" name="searchbutton" value="Search" id="searchbutton">

和jQuery的：

$('#searchbutton').click(function(event){ 
    if ($('input[name="gender"]:checked').length < 1) { 
     alert("Select the field first"); 
     event.preventDefault(); 
    } 
});

Working Demo

說明：本attribute selector將匹配input（胡）的name是gender，而:checked選擇器只選擇那些被選中的選項。然後使用length我們可以看到有多少元素匹配。如果爲零，則表示該用途沒有選擇任何選項。

來源

2011-04-19 09:35:15 kapa

+1很好的答案，更快，並與演示！ – 2011-04-19 09:42:57

根據我的理解，您正試圖確保用戶對性別進行選擇。

直接的問題是兩個<input type="radio">都有相同的ID。儘管給它們起同樣的名字是適當的，但是絕對不會給出相同的兩個元素ID。

此外，你應該簡單地檢查是否有任何單選按鈕被選中。這是我將如何寫上面的代碼：

$('#searchbutton').click(function (e) { 
    if ($(':radio:checked[name="gender"]').length == 0) { 
     alert("Select the field first"); 
     e.preventDefault(); 
    } 
});

來源

2011-04-19 09:39:51

+1我還沒有想過'：radio'，很好的解決方案。 – kapa 2011-04-19 09:47:43

jQuery event.preventDefault混淆

回答

相關問題