簡單的jQuery選擇

所以我有一個基本形式簡單的jQuery選擇

<div id="webForm_Contact"> 
    <form action=""> 
     <label for="form_fName"> Full name: </label> 
     <input type="text" id="form_fName"><br /> 
     <label for="form_email" > Email: </label> 
     <input type="text" id="form_email"><br /> 
     <label for="form_phone"> Phone </label> 
     <input type="text" id="form_phone"><br /> 
     <label for=""> Location: </label> 
     <label for="form_radio_london"> London</label> 
     <input type="radio" id="form_radio_london" value="London"> 
     <label for="form_radio_Toronto"> Toronto</label> 
     <input type="radio" id="form_radio_Toronto" value="Toronto">   
     <label for="form_radio_other"> Other</label> 
     <input type="radio" id="form_radio_other" value="Other"> 

     <!-- radio select here--> 

      <div id="otherCity"> 
       <label for="form_otherCity"> Other City </label> 
       <input type="text" id="form_otherCity"> 
      </div> 
      <br /> 
     <input type="submit" value="Submit"> 

    </form> 
</div>

和簡單的jQuery :: 編輯::改變了代碼一點，因爲我意識到這是做更多的則需要它。

$（文件）。就緒（函數（）{

if($("#form_radio_other").is(':checked')){ 
     $("#otherCity").css("display:inline"); 
    } 
    else{ 
     $("#otherCity").css("display:none"); 
    } 


});

什麼它應該做的，就是如果單擊「其他」單選按鈕，取消隱藏「otherCity」分區允許表單輸入，其他明智它需要隱藏什麼，我不明白是什麼是錯的。我不是在瀏覽器相關的問題與它的自身的代碼獲得，只是問題。任何幫助，將不勝感激。

來源

2013-09-20 CTully12

你沒有name屬性，在HTML（<input type="radio" id="form_radio_other" value="Other">）和您的JQuery css功能無效。

變化是這樣的：

$('#form_radio_other').change(function(){ 
    if($("#form_radio_other").is(':checked')){ 
     $("#otherCity").css("display","inline"); 
    } 
    else{ 
     $("#otherCity").css("display","none"); 
    } 
});

JSFiddle

來源

2013-09-20 23:58:54 Vucko

這樣做，謝謝！ – CTully12

改變你的JavaScript於：

$(document).ready(function(){ 
    $("input:radio").change(function(){ 
     if($('#form_radio_other').is(':checked')){ 
      $("#otherCity").css("display","inline"); 
     } 
     else{ 
      $("#otherCity").css("display","none"); 
     } 
    }); 
});

您還應該添加一個name屬性具有相同價值，你的所有無線電投入，所以他們實際上像單選按鈕的工作。

的jsfiddle例如：http://jsfiddle.net/nWkhT/

來源

2013-09-20 23:56:34 Sadiq

你的jQuery選擇都有點亂了。

例如：$('input:radio[name="form_radio_other"]').change...試圖選擇具有form_radio_other的名字，這不存在的收音機。它應該是$('#form_radio_other')。

if($("form_radio_other")未使用.或#來選擇要查找的內容。這裏

來源

2013-09-20 23:57:06

多個問題：

單選按鈕的名稱必須是相同的，把它們放在同一組
JQuery的CSS功能就像.css("attr", "value")，不.css("attr:value")

$('input:radio').change(function(){ 
    if($("#form_radio_other").is(':checked')){ 
     $("#otherCity").css("display", "inline"); 
    } 
    else{ 
     $("#otherCity").css("display", "none"); 
    } 
});

Fiddle

來源

2013-09-20 23:58:08 McGarnagle

謝謝！這是因爲我已經做了一些這樣的jQuery。我很感激。 – CTully12

爲了選擇你要使用name屬性爲每一個

例子只是一個單選按鈕：<input type="radio" id="form_radio_london" value="London" name="myradiobuttongroup"/>

來源

2013-09-21 00:01:43

是的，剛剛看到並修復它。謝謝！ – CTully12

簡單的jQuery選擇

回答

相關問題