根据单选按钮值更改提交按钮文本

Change submit button text based on radio-button value

本文关键字:提交 按钮 文本 单选按钮      更新时间:2023-09-26

如何根据哪个单选按钮处于活动状态来更改提交按钮文本?

这是我的代码,但它不起作用。它只更改一次文本。

我有两个单选按钮:

<input type="radio" name="build-team" class="choose" value="build" /> Yes
<input type="radio" name="build-team" class="choose" value="show" /> No
<button class="show-result" data-chooseyes="Yes" data-chooseno="No">Yes</button>

我有脚本:

$(document).on('click', '.choose', function() {
    var target = $('.show-result');
    if ($(this).attr('checked') == 'checked') {
      target.html(target.data('chooseyes'));
    }
    else {
      target.html(target.data('chooseno'));
    }
})

JSFiddle 示例

$(document).on('click', '.choose', function() {
    var target = $('.show-result');
      target.html($(this).val());
   
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="build-team" class="choose" value="Yes" /> Yes
<input type="radio" name="build-team" class="choose" value="No" /> No
<button class="show-result" data-chooseyes="Yes" data-chooseno="No">Yes</button>

$('.opt').click(function(){
  $('#button').html($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="opt" name="opt" type="radio" value="Yes" checked="checked">Yes
<input class="opt" name="opt" type="radio" value="No">No
<button id="button" type="submit">Yes</button>

这是最简单的答案,没有添加属性,只有干净的HTML + jQuery,同样重要的是要意识到默认情况下必须始终选择/选中一个无线电,如果没有,则必须验证该字段并且验证无线电并不酷哈哈:)有好的一天!