使用HTML5中的javascript单击单选按钮事件

时间:2012-06-01 09:13:11

标签: jquery css html5

我想使用Dot net在HTML5中使用jquery获取单选按钮的click事件。我在手风琴面板上有两个单选按钮,当我点击手风琴面板的任何一个关闭单选按钮时,另一个面板应该打开但不是 我的jquery代码如下:

<script type="text/javascript">

$(document).ready(function () {

    $("#radioinstant").click(function () {

        $(".flip").hide();
        $(".panel").hide();
        $(".flip1").show();
        $(".panel1").show();
    });
});

但我无法检查单选按钮是否点击,无法打开另一个面板。

4 个答案:

答案 0 :(得分:0)

不确定..但试一试.. $(文件).ready(function(){

$("#youraccordionid #radioinstant").click(function (e) {
e.preventDefault(); //preventing the default behaviour of accordion

    $(".flip").hide();
    $(".panel").hide();
    $(".flip1").show();
    $(".panel1").show();
});

});

答案 1 :(得分:0)

 $(document).ready(function()
{
    $(".flip1").click(function()
   {

         do what u want here
    });

  $(".flip2").click(function()
   {

     do what u want here
    });

 });

and keep this tags 

 <input name="rad1" type="radio" class="flip1"> radio1  </p>
 <input name="rad1" type="radio" class="flip2"> radio2  </p>

答案 2 :(得分:0)

什么是#radioinstant?如果你在每个单选按钮上放置id =“radionistant”,它将无法工作。 ID必须是唯一的,重复ID的结果取决于浏览器。如果id =“radioinstant”在包含所有无线电的元素上,它将起作用,因为事件会冒泡到它,但是如果你点击#radioinstant本身或其中任何其他元素,它也会被激活。< / p>

如果要将事件绑定到多个元素,请按类(给所有无线电设备提供相同的类)或按元素类型(绑定到页面上的所有无线电)进行操作。您还可以使用“#container input:radio”或“#container .radio_class”来缩小绑定范围。

您还可以检查是否选中了特定的收音机。它与复选框相同:

if ($('.radio_1').is(':checked')) {
    //something
}
else if ($('.radio_1').is(':checked')) {
    //something else
}
//etc

你也可以用$('input:radio:checked')选中选中的收音机并检查它的类或值或其他。

答案 3 :(得分:-1)

编写一个函数,该函数传递单击的单选按钮的值以显示和隐藏您想要显示或隐藏的内容:

function Getvalue(id) {
        if (id == "your radio button id") {
           //do what you want
        }
        else{
            // do what you want
        }