当您检查单选按钮时触发一个动作

这里是我的HTML，其中有两个单选按钮。默认选中的按钮是“租赁”按钮。当您检查单选按钮时触发一个动作

<input 
    id="quotation_request_payment_option_lease" 
    class="choose_payment_option" 
    name="quotation_request[payment_option]" 
    type="radio" 
    value="lease" 
    checked="checked"> 
    <input 
    id="quotation_request_payment_option_finance" 
    class="choose_payment_option" 
    name="quotation_request[payment_option]" 
    type="radio" 
    value="finance">

我想要做的是，当租赁按钮被选中时，打印“租赁”到控制台。当检查“财务”时，打印“财务”到控制台。我试过各种东西都无济于事。

这不起作用：

$(document).ready(function() { 
    $('input[type=radio[name='quotation_request[payment_option]']').change(function() { 
    if (this.value == 'lease') { 
     console.log("lease"); 
    } 
    else if (this.value == 'finance') { 
     console.log("finance"); 
    } 
}); 
});

来源

2017-06-20 AliciaGuerra

*“默认选中的按钮是”租赁“按钮。”* - 为什么在两个按钮上都选中了checked =“checked”？ – nnnnnn

这是一个错字，我的意思是只检查=“检查”的租约按钮 – AliciaGuerra

你可以写选定值直接控制台。为您的CSS选择器使用单引号和双引号的组合。

$("input[type=radio][name='quotation_request[payment_option]'").change(function() { 
 
    console.log($(this).val()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="quotation_request_payment_option_lease" class="choose_payment_option" name="quotation_request[payment_option]" type="radio" value="lease" checked="checked"> 
 
<input id="quotation_request_payment_option_finance" class="choose_payment_option" name="quotation_request[payment_option]" type="radio" value="finance" checked="checked">

来源

2017-06-20 03:04:01 Alexander

但这适用于页面上的每个单选按钮，而不仅仅是具有指定名称的单选按钮。 – nnnnnn

@nnnnnn，然后使用'''和'''组合来指定您的CSS选择器。您也可以使用'[name^= quotation_request]'而不是'[name ='quotation_request [payment_option]''。 – Alexander

$(document).ready(function() { 
 
    $(":radio[name='quotation_request[payment_option]']").change(function() { 
 
    if (this.value == 'lease') { 
 
     console.log("lease"); 
 
    } else if (this.value == 'finance') { 
 
     console.log("finance"); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="quotation_request_payment_option_lease" class="choose_payment_option" name="quotation_request[payment_option]" type="radio" value="lease" checked="checked"/> 
 
<input id="quotation_request_payment_option_finance" class="choose_payment_option" name="quotation_request[payment_option]" type="radio" value="finance" />

像上面更改您的选择。
您可以使用:radio选择单选按钮

来源

2017-06-20 03:05:16 guradio

我试过那...不知道为什么它不起作用，如果它在你运行这段代码时起作用 – AliciaGuerra

@AliciaGuerra你可以检查控制台是否有错误吗？ – guradio

有趣的是，我没有在控制台中看到错误，但它不打印租赁和融资 – AliciaGuerra

运行的代码段在控制台中看到

$('input[type=radio]').change(function() { 
 
console.log($(this).val()); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input 
 
    id="quotation_request_payment_option_lease" 
 
    class="choose_payment_option" 
 
    name="quotation_request[payment_option]" 
 
    type="radio" 
 
    value="lease" 
 
    checked="checked"> 
 
    <input 
 
    id="quotation_request_payment_option_finance" 
 
    class="choose_payment_option" 
 
    name="quotation_request[payment_option]" 
 
    type="radio" 
 
    value="finance" 
 
    checked="checked">

来源

2017-06-20 03:05:27

但是，这将适用于页面上的* all *单选按钮，而不仅仅是具有'name =“quotation_request [payment_option]”'的两个单选按钮。（即使OP当前没有其他无线电，它们可能在将来也是如此）。 – nnnnnn

在HTML复选框更改添加以下触发

onchange="myFunction(this)"

，在我的功能

function myFunction(element) 
{ 
    //do stuff 
}

这个怎么样

来源

2017-06-20 03:05:49 Hatik

你的CSS选择器是什么原因造成的问题，请尝试使用：

$("input[name='quotation_request[payment_option]']").change(function() { 
... 
}

来源

2017-06-20 03:09:28 AKMorris

这适用于页面上的* all *单选按钮，而不仅仅是具有'name =“quotation_request [payment_option]”'的两个单选按钮。（即使OP目前没有其他无线电，他们可能在将来） – nnnnnn

嗨，我更新了我的答案，所以它现在只会影响单选按钮的名称“quotation_request [payment_option]” – AKMorris

你的jQuery选择是错误的。它应该是

$("input[type='radio'][name='quotation_request[payment_option]']").change(function(){  
    var value = $(this).val()  
    if(value == "lease") {  
     console.log(value);  
    } else if(value == "finance") {  
     console.log(value);  
    } 
});

来源

2017-06-20 03:12:11 Toni

*“您的jquery对象”* - 我认为你的意思是* selector *，而不是* object *。为什么你使用'$（this）.attr（“value”）'而不是'this.value'？ – nnnnnn

没错。谢谢 – Toni

当您检查单选按钮时触发一个动作

回答

相关问题