如何在通过代码检查底层无线电时更改Jquery ui按钮？

Question

如何在通过代码检查底层无线电时更改Jquery ui按钮？

我正在尝试为我的单选按钮组使用Jquery UI按钮插件.用户界面看起来很酷,但问题是当我更改基础单选按钮的已检查属性时,UI不会更改.对于前如果我有3个单选按钮说radio1,radio2,radio3,如果我选择radio1,那么按钮不会改变,但是当我刷新时它正确显示.

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/start/jquery-ui.css" type="text/css" rel="Stylesheet" />

    <script type="text/javascript">
    $(function() {      
        $("#radio").buttonset();        
        $("#mybutton").button();
        $("#mybutton").click(function(){$("#radio1").attr("checked","checked");alert($("#radio1").attr("checked"));//returns true});
    });
    </script>
    <style>
        #format { margin-top: 2em; }
    </style>
</head>
<body>
<div class="demo">

    <form>
        <div id="radio">
            <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
            <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
            <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
        </div>
        <br/>
        <input type="button" id="mybutton" value="click me"/>
    </form>

</div><!-- End demo -->

</body>
</html>

Run Code Online (Sandbox Code Playgroud)

任何帮助深表感谢.

提前致谢,

拉贾

Answer 1

Nic*_*ver 16

使用该refresh方法更新状态,如下所示:

$("#mybutton").click(function(){
    $("#radio1").attr("checked","checked");
    $("#radio").buttonset('refresh');
});

Run Code Online (Sandbox Code Playgroud)

你可以在这里试一试,来自文档:

refresh - 刷新按钮的视觉状态.在以编程方式更改本机元素的已检查或禁用状态后更新按钮状态非常有用.

归档时间：	15 年，2 月前
查看次数：	6573 次
最近记录：	13 年，3 月前