Question

我有一个包含两个单选按钮和一个按钮的表单。我想根据选择的两个单选按钮中的哪一个来更改按钮的值。我的猜测是，使用jQuery比使用PHP更好，但如果这是错误的假设，请告诉我。

以下是HTML的示例：

<form>
  <ul>
    <li>
     <input type="radio" name="basic" value="basic1">
     <label for="basic1">Basic 1</label>
    </li>
    <li>
    <input type="radio" name="basic" value="basic2">
    <label for="basic2">Basic 2</label>
    </li>
  </ul>
  <button id="basic1" name="startReg" type="submit" value="basic1">Confirm</button>
</form>

简而言之，我想将按钮ID和值替换为选择了哪个单选按钮的值。因此，如果选择了第二个单选按钮，则按钮标记将如下所示：

<button id="basic2" name="startReg" type="submit" value="basic2">Confirm</button>

Answer 1

你可以这样做：

$(':radio').on('change', function() {

  // this.value for get the id of radio

  $('button[name=startReg]')
                        .attr('id', this.value )   // change id of button
                        .val( this.value );        // update value of button
});

<强> DEMO

但选定的radio值会自动提交。

Answer 2

$('input:radio').click(function(){
  $('button').prop({'id' : $(this).val(), 'value' : $(this).val()});   
});

Answer 3

只需更改控件的名称，它就会发送与更改按钮值时相同的表单数据：

<form>
  <ul>
    <li>
     <input type="radio" name="startReg" value="basic1" checked="checked">
     <label for="basic1">Basic 1</label>
    </li>
    <li>
    <input type="radio" name="startReg" value="basic2">
    <label for="basic2">Basic 2</label>
    </li>
  </ul>
  <button id="basic1" name="somethingElse" type="submit">Confirm</button>
</form>

如何根据选择一组单独的单选按钮更改按钮的“值”和“id”

3 个答案: