使用jQuery獲取並設置下拉值

如果用戶從下拉菜單中選擇一個選項，它將顯示一個文本框，但是如果他選擇的值爲「Other」的選項，那麼一行將顯示爲其他值輸入值。當選項的值不等於「其他」使用jQuery獲取並設置下拉值

<script type="text/javascript"><!-- 
function setAndReset(box) { 
if(box.value == 'Other'){ 
    $("#ShowHide").hide(); 
} 
document.FormName.hiddenInput.value = box.value; 

} 
//--> 
</script> 

<body bgcolor="#ffffff"> 
<form id="FormName" action="" method="get" name="FormName"> 
    <select name="choice1" size="1" onchange="setAndReset(this);"> 
    <option value="one">first</option> 
    <option value="two">second</option> 
    <option value="three">third</option> 
    <option value="other">Other</option> 
    </select> 

    <input type="text" name="hiddenInput" value=""> 
    <tablt><tr id="ShowHide"><td> 
     <input type="text" name="otherInput"> 
    </td></tr></table> 
    <input type="submit" name="submitButtonName"> 
</form> 
</body>

，但它並沒有顯示/隱藏文本框&不設置值

我的代碼工作，除了罰款。

如果它使用jquery解決，那麼我將感謝你的代碼。

謝謝。

來源

2010-05-10 PHP Ferrari

做這樣的：

$(document).ready(function() { 
    $("select[name=choice1]").change(function() { 
     $(this).val() == 'other' ? $("#ShowHide").show() : $("#ShowHide").hide(); 
    }); 
});

，失去了內聯平變化的函數調用。 Try it here。

來源

2010-05-10 15:23:20 karim79

你想$（本）.VAL（）== 「其他」而不是「其他」 – brad 2010-05-10 15:31:33

@brad - 是的，碰到了，雖然我是做了一個小的演示。 – karim79 2010-05-10 15:35:26

我喜歡karim79的答案，但更喜歡有點更緊湊：

$(function() { 
    $("select[name=choice1]").change(function() { 
     $("#ShowHide").toggle($(this).val() === "other"); 
    }); 
});

相反的$(document).ready(f)，做$(f)，這是完全一樣的
而不是鬆散==，使用===了準確的比較（在這種情況下並不重要，但==可能會有奇怪的表現，所以你應該避免到處）
使用toggle(b)而不是show()/hide()

來源

2010-05-10 15:42:34 svinto

我沒有意識到切換採取了布爾值！很好，簡潔 – brad 2010-05-10 17:43:18

使用jQuery獲取並設置下拉值

回答

相關問題