change field value when select radio buttons

问题

I want to change the value of hidden input field when radio buttons selected :

    <input type="radio" name="r1" value="10" />10
    <br/>
    <input type="radio" name="r1" value="45" />45
    <br/>
    <input type="hidden" name="sum" value="" />

for example when user click on one the buttons the value of hidden field change to that value.

回答1:

Use the onClick property:

<input type="radio" name="r1" value="10" onClick="document.getElementById('hidfield').value=this.value"/>10
    <br/>
    <input type="radio" name="r1" value="45" onClick="document.getElementById('hidfield').value=this.value"/>
    45
    <br/>
    <input type="hidden" name="sum" value="" id="hidfield" />

回答2:

You can try for example

<input type="radio" id="radio1r1" name="r1" value="10" />10
<br/>
<input type="radio" id="radio2r1" name="r1" value="45" />45
<br/>
<input type="hidden" name="sum" value="" />

jQuery("input[id^='radio']").click(function() {
    jQuery("input[name='sum']").val(jQuery(this).val());
}

So then when user click on each radio we handle it by various id with same start.

回答3:

Using jQuery it would be:

$(":radio").click(function () {
    var inputValue = $this.val();
    $(":hidden[name='sum']").val() = inputValue;
$(":hidden[name='sum']").name() = "lalala";
    });

I've not double checked that code so it might need a little tweaking.

回答4:

hook into the onclick event for the radio button "r1". Normally I'd suggest the onchange event but in IE it isn't fired until the user "blurs" the radio button.

If you are using a framework like jQuery, hook in the events in a nice unobtrusive manner... but if you want a quick n dirty solution, just add the events inline.

<input type="radio" name="r1" value="10" onclick="doIt(this);"/>10
<br/>
<input type="radio" name="r1" value="45" onclick="doIt(this);"/>45
<br/>
<input type="hidden" name="sum" value="" />

<script>
  function doIt(obj){
    //alert('my value is now: ' + obj.value);
    obj.form.elements['sum'].value = obj.value;//set hidden field to radio value
  }
</script>

来源：https://stackoverflow.com/questions/1322525/change-field-value-when-select-radio-buttons

标签

javascript

html

radio-button

hidden-field