想從一個單選按鈕得到結果酥料餅

我的代碼：想從一個單選按鈕得到結果酥料餅

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> 
    <title>Bootstrap 101 Template</title> 
    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 
</head> 

<body> 
    <h2>Hello</h2> 
    <button type="button" id="example" class="btn btn-danger" data-container="body" data-html="true" data-toggle="popover" data-placement="right" data-content="&lt;form id='myform' class='form-horizontal'&gt; 
&lt;input type='radio' id='rb1' name='keys' value='Adult' bind-value='key'&gt; 
Adult &lt;br&gt; 
&lt;input type='radio' id='rb2' name='keys' value='Child' bind-value='key'&gt; 
Child &lt;br&gt; 
&lt;input type='radio' id='rb3' name='keys' value='Concession' bind-value='key'&gt; 
Concession &lt;/form&gt;" data-original-title="Select seat type">Hello 
    </button> 
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 
    <script src="js/bootstrap.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('#example').popover(); 
     $('#myform input').on('change', function() { 
      alert($('input[name=keys]:checked').val()); 
     }); 
    }); 
    </script> 
</body> 

</html>

我想顯示選中的單選按鈕的報警值（放入酥料餅）。不知何故，這些代碼根本不會提示警報。彈出窗口顯示完美，單選按鈕也正確顯示。只有警報不會顯示彈出窗口中單選按鈕的選擇。請幫忙！

來源

2015-05-18 Saransh Seth

問題出在何時初始化偵聽器。該窗體不存在，直到顯示彈出窗口。所以你需要在初始化事件監聽器之後。

下面是摘錄：

$(document).ready(function() { 
 
    $('#example').popover(); 
 

 
    $('#example').on('shown.bs.popover', function() { 
 
    $('#myform input').on('click', function() { 
 
     alert($('input[name=keys]:checked').val()); 
 
    }); 
 
    }); 
 

 
});

<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> 
 
    <title>Bootstrap 101 Template</title> 
 

 
    <!-- Bootstrap --> 
 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
 

 
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
 
    <!--[if lt IE 9]> 
 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
 
    <![endif]--> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
 

 
    <!-- Optional theme --> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"> 
 
</head> 
 

 
<body> 
 
    <h2>Hello</h2> 
 
    <button type="button" id="example" class="btn btn-danger" data-container="body" data-html="true" data-toggle="popover" data-placement="right" data-content="&lt;form id='myform' class='form-horizontal'&gt; 
 
&lt;input type='radio' id='rb1' name='keys' value='Adult' bind-value='key'&gt; 
 
Adult &lt;br&gt; 
 
&lt;input type='radio' id='rb2' name='keys' value='Child' bind-value='key'&gt; 
 
Child &lt;br&gt; 
 
&lt;input type='radio' id='rb3' name='keys' value='Concession' bind-value='key'&gt; 
 
Concession &lt;/form&gt;" data-original-title="Select seat type">Hello 
 
    </button> 
 
</body> 
 

 
</html>

來源

2015-05-18 07:31:58

Thanx它爲我工作！ –

就是這樣;

$("input:radio[name=keys]").click(function() { 
    var value = $(this).val(); 
    alert(value); 
});

在這裏類似的回答; In jQuery, how do I select an element by its name attribute?

來源

2015-05-18 07:25:32

$(document).ready(function(){ 
 
\t \t $('#example').popover(); 
 
\t \t $("form").find('input[type="radio"]').on('change', function() { 
 
\t \t alert($('input[name=keys]:checked').val()); 
 
\t \t }); 
 
\t });

在這裏，我是如何設法讓你的目標完成。上面的是我的代碼，用於獲取所選單選按鈕的值。

來源

2015-05-18 07:59:25

想從一個單選按鈕得到結果酥料餅

回答

相關問題