Question

组，

我的代码不符合我的意图。不知道我错过了什么。你能帮忙吗？一旦用户点击单选按钮，我想要闪烁警报。但是，单击单选按钮时不会发生任何事情。

<HTML>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">


$('#amtopts input').on('change', function() {
   alert($('input[name=amount_r]:checked', '#amtopts').val()); 
});

var donateamt = document.getElementsByName('amount_r');
var donateamt_value;

function GetDonationAmt() {
    for(var i = 0; i < donateamt.length; i++){
        if(donateamt[i].checked){
            donateamt_value = donateamt[i].value;
            alert("Donation Amount is "+donameamt_value); 
            break;
        }
    }
 }
 );
 </script>
 <body>
 <h1>Donate Now</h1>
 <p></p>    
  Amount: Amount: <form id="amtopts"><input type="radio" id="amount_r" name="amount_r" value="50"> 50<input type="radio" id="amount_r" name="amount_r" value="75"> 75<input type="radio" id="amount_r" name="amount_r" value="100" > 100<input type="radio" id="amount_r" name="amount_r" value="150"> 150</form>

</body>
</html>

Answer 1

如果您使用src属性，则不能在脚本标记内包含代码。：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
code
</script>

你必须这样做：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<script>
code
</script>

$('#amtopts input').on('change', function() {
  alert($('input[name=amount_r]:checked', '#amtopts').val());
});

var donateamt = document.getElementsByName('amount_r');
var donateamt_value;

function GetDonationAmt() {
  for (var i = 0; i < donateamt.length; i++) {
    if (donateamt[i].checked) {
      donateamt_value = donateamt[i].value;
      alert("Donation Amount is " + donameamt_value);
      break;
    }
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<body>
  <h1>Donate Now</h1>
  <p></p>
  Amount: Amount:
  <form id="amtopts"><input type="radio" id="amount_r" name="amount_r" value="50"> 50<input type="radio" id="amount_r" name="amount_r" value="75"> 75<input type="radio" id="amount_r" name="amount_r" value="100"> 100<input type="radio" id="amount_r" name="amount_r" value="150">    150</form>

正如RoryMcCrossan所说，将代码打包成文档是个好主意：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    code
})
</script>

Answer 2

您需要绑定onclick事件：

$("input[name='amount_r']").click(function(){
alert('You clicked radio1!');
    alert($('input:radio[name=amount_r]:checked').val());


});

Answer 3

您必须修改j查询API的脚本标记，不要将自定义J查询放在j查询API的相同脚本标记内。见下面的代码。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我使用class而不是name / id来最小化代码，请遵循代码，你一定会得到flash消息。

HTML：

    <form id="amtopts">
  <input type="radio" id="amount_r" name="amount_r" class="amt" value="50"> 50
  <input type="radio" id="amount_r" name="amount_r" class="amt" value="75"> 75
  <input type="radio" id="amount_r" name="amount_r" class="amt" value="100" > 100
  <input type="radio" id="amount_r" name="amount_r" class="amt" value="150"> 150
  </form>

J查询：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
 $(document).ready(function() {
    $('.amt').click(function() {
      alert($(this).val())
    })
 })
 </script>

JQuery不适用于单选按钮

3 个答案: