Question

在我的仪表板中有4个单选按钮。我只需要展示一个条件。每个按钮都有不同的值

<input type="radio" name="payment_method" id="payment_method" value="Online-Others">
<input type="radio" name="payment_method" id="payment_method" value="Cash">
<input type="radio" name="payment_method" id="payment_method" value="wallet">
<input type="radio" name="payment_method" id="payment_method" value="online">

这里我只需要显示现金按钮。我应该为每个按钮制作不同的ID吗？或者使用这个我能够证明吗？

Answer 1

您可以使用属性选择器按值删除元素：

// removes all 'payment_method' radios where 'value' is not 'Cash'
$(".payment_method[value!=Cash]").remove();

但由于ids在HTML中是唯一的，您可以（必须）更好地更改它们：

<input type="radio" name="payment_method" id="payment_method_others" value="Online-Others">
<input type="radio" name="payment_method" id="payment_method_cash" value="Cash">
<input type="radio" name="payment_method" id="payment_method_wallet" value="wallet">
<input type="radio" name="payment_method" id="payment_method_online" value="online">

JS：

// removes all 'payment_method' radios where 'id' is not 'payment_method_cash'
$(".payment_method:not(#payment_method_cash)").remove();

Answer 2

无需添加ID或类

    $('input[name=payment_method][value=wallet]').prop('checked',true); //if you need to highlight "wallet"
    $('input[name=payment_method][value=Cash]').prop('checked',true); //if you need to highlight "Cash"

Answer 3

你的问题对我来说不太清楚，你期待这样的事吗？

＆＃13;

$('#payment_method_cash').on('change', function() {

  // Show cash payment button and options.
  console.log('Cash option checked : ' + $(this).prop('checked'));
});

$('#payment_method_wallet').on('change', function() {

  // Show wallet payment button and options.
  console.log('wallet option checked : ' + $(this).prop('checked'));
});

$('#payment_method_online').on('change', function() {

  // Show online payment button and options.
  console.log('online option checked : ' + $(this).prop('checked'));
});


$('#payment_method_other').on('change', function() {

  // Show other payment button and options.
  console.log('Other option checked : ' + $(this).prop('checked'));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="payment_method" id="payment_method_other" value="Online-Others">
<input type="radio" name="payment_method" id="payment_method_cash" value="Cash">
<input type="radio" name="payment_method" id="payment_method_wallet" value="wallet">
<input type="radio" name="payment_method" id="payment_method_online" value="online">

＆＃13;

Answer 4

您可以删除id属性，并可以使用value属性。

HTML

<input type="radio" name="payment_method"  value="Online-Others">
<input type="radio" name="payment_method"  value="Cash">
<input type="radio" name="payment_method"  value="wallet">
<input type="radio" name="payment_method"  value="online">

jquery代码就像

//if you want to show only Cash radio button

$(document).ready(function() {
    $("input[value!='Cash']").css('display','none');
 });

或者，如果你想在jquery下面检查一个单选按钮，请使用。

//if you want to checked Cash radio button out of four use below

 $(document).ready(function() {
    $("input[value='Cash']").attr('checked','true');
   });

希望它会有所帮助。

使用值删除单选按钮

4 个答案: