3

我正在使用 jQuery .val() 从包含两组单选按钮的表单中提取数据结果。

<!DOCTYPE HTML>
<html>
    <head>  

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

    <script type="text/javascript">

    function userPrefsSubmitted() {
    console.log(  $('form input[@name=cssOn]:checked').val()   );
    console.log(  $('form input[@name=halfFramesOn]:checked').val()   );
    }   
    </script>

</head>
<body>  
<p>Choose User Prefs</p>
<form>
    <p>Transitions</p>
    <div><input type="radio" name="cssOn" value=true>True</div>
    <div><input type="radio" name="cssOn" value=false>False</div>
    <p>Half Frames</p>  
    <div><input type="radio" name="halfFramesOn" value=true>True</div>
    <div><input type="radio" name="halfFramesOn" value=false>False</div>
    <br/><br/>
    <input class="submitButton" type="button" onClick="userPrefsSubmitted()" value="tap when done" />
</form> 

</body>
</html>

如果我选择 fasle 然后是 true 并点击按钮 console.log 显示 false false

这让我发疯了，我搜索了这个论坛以及互联网，但没有找到答案。我哪里错了？

4

4 回答 4

9

没有@. 你可以轻松做到：

function userPrefsSubmitted() {
  console.log(  $('form input[name=cssOn]:checked').val()   );
  console.log(  $('form input[name=halfFramesOn]:checked').val()   );
}
于 2012-08-01T03:45:54.683 回答
2

或者试试这个：工作演示 http://jsfiddle.net/4T5r3/

注：http ://www.electrictoolbox.com/at-name-selector-removed-jquery/

不带@ 的这些选择器的使用也适用于jQuery 1.2 分支。我不确定它是否适用于旧版本。

代码

function userPrefsSubmitted() {
    alert($('form input[@name=cssOn]:checked').prop('value'));
    alert($('form input[@name=halfFramesOn]:checked').prop('value'));
}​

J 1.2 >

  function userPrefsSubmitted() {
        alert($('form input[name=cssOn]:checked').prop('value'));
        alert($('form input[name=halfFramesOn]:checked').prop('value'));
    }​

工作图像 当真时选择

在此处输入图像描述 错误选择时工作图像

在此处输入图像描述

于 2012-08-01T03:48:06.117 回答
1 
function userPrefsSubmitted() {
console.log(  $('form input[name=cssOn]:checked').val()   );
console.log(  $('form input[name=halfFramesOn]:checked').val()   );
}
于 2012-08-01T03:46:52.920 回答
0

也请尝试$(":checked").val()

代替

$('form input[@name=halfFramesOn]:checked').val()

这将简单地返回所有选中的单选按钮。

于 2012-08-01T03:47:20.290 回答