无法选择单选按钮Value Jquery

时间:2013-05-26 15:59:31

标签: jquery html

我有一个似乎有效的代码,除非我从对话框窗口中选择单选按钮,它总是选择第一个值。我在php中使用带有ID(pd_id)的代码来提供我想要的结果。

你能指出,可能有什么不对吗?在这个例子中,无论我从单选按钮中选择哪个选项,我总是得水。

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<style>
    body { font-size: 62.5%; }
    label, input { display:block; }
    input.text { margin-bottom:12px; width:95%; padding: .4em; }
    fieldset { padding:0; border:0; margin-top:25px; }
    h1 { font-size: 1.2em; margin: .6em 0; }
    div#users-contain { width: 350px; margin: 20px 0; }
    div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
    div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
    .ui-dialog .ui-state-error { padding: .3em; }
    .validateTips { border: 1px solid transparent; padding: 0.3em; }
</style>

<script>
    $(function() {
        var name = $("#name_34");

        $("#dialog-form-34").dialog({
            autoOpen: false,
            height: 300,
            width: 350,
            modal: true,
            buttons: {
                "Select": function() {
                    var bValid = true;
                    name.removeClass("ui-state-error");
                     //name.val("").removeClass("ui-state-error");

                  //  $("#users_34 input").append(name.val());



                    $('input[name=users_34]').val(name.val());
alert(name.val());

                    $(this).dialog("close");


                },
                Cancel: function() {
                    $(this).dialog("close");
                }
            },
            close: function() {
                name.val("").removeClass("ui-state-error");
            }
        });

        $("#spice_34")
                .button()
                .click(function() {

            $("#dialog-form-34").dialog("open");
        });
    });
</script>




<form id="dialog-form-34" title="Select Spice Level" method="post">

    <input type="radio" id="name_34" value="Water" class="text ui-widget-content ui-corner-all"> Water<br>
<input type="radio" id="name_34" value="Beer" class="text ui-widget-content ui-corner-all"> Beer<br>
<input type="radio" id="name_34" value="Wine" checked class="text ui-widget-content ui-corner-all">Wine 
</form>          


<input id="users" name="users_34" type="text "class="ui-widget ui-widget-content" readonly/>         
<button id="spice_34">Select</button>

1 个答案:

答案 0 :(得分:1)

HTML中不同的元素必须具有不同的ID。您必须使单选按钮的名称是:

<input type="radio" name="yourname" value="Water" class="text ui-widget-content ui-corner-all"> Water<br>
<input type="radio" name="yourname" value="Beer" class="text ui-widget-content ui-corner-all"> Beer<br>

然后,要获取所选元素的值,您可以执行以下操作:

var value = $('[name="yourname"]:checked').val();