单击按钮无法正常工作

时间:2014-04-01 18:33:55

标签: javascript html

我试图在更改单选按钮时更改提交按钮的文本。我的代码是html部分:

<input type="radio" onclick="check()" name="radio-view"  data-icon="segment-titlestyle-segonly"  id="segment1" value="Yes"/> 
<label for="segment1"  id="controls">
<span class="ui-btn-text-controls">Yes</span>
</label> 

<input type="radio" onclick="check()" name="radio-view" data-icon="segment-titlestyle-segonly" id="segment2" value="No" checked="checked"/>  
<label for="segment2" id="controls">
<span class="ui-btn-text-controls">No</span>
</label> 


<input type="submit" value="send" name="sendbutton" id="sendbutton"/>

我的javascript代码如下:

function check(){
var x;
x=document.f1.radio-view;
if(x[0].checked){
    document.f1.sendbutton.value="PROCEED";
}
else if(x[1].checked){
    document.f1.sendbutton.value="SEND";
}
}

但它没有改变测试。它可能是什么原因?

2 个答案:

答案 0 :(得分:1)

如果您决定直接处理元素,请正确使用其名称:

var x = document.f1['radio-view'];

...因为您无法使用点语法访问名称不是有效标识符的属性。 document.f1.radio-view被视为document.f1.radio - view,这显然毫无意义。

但实际上,我宁愿完全跳过这一部分:如果单击单选按钮,它肯定会设置为已选中。所以这......

<input type="radio" onclick="check(this)" ... />
...
function check(button) {
  document.f1.sendbutton.value = button.value === 'Yes' ? 'PROCEED' : 'SEND';
}

......应该足够了,正如demo所示。

答案 1 :(得分:0)

在此处查看演示:http://jsfiddle.net/Tngbs/

//HTML
<form>
    <fieldset id="SPserviceStatus" data-role="controlgroup" data-type="horizontal" data-mini="true">
                    <legend>Group<span class="required">*</span></legend>
                    <input type="radio"  name="ss" id="s1" value="Yes">
                    <label for="serviceStatus1">Yes</label>
                    <input type="radio"  name="ss" id="s2" value="No"  checked="checked">
                    <label for="serviceStatus2">No</label>
                </fieldset>
                        <input type='submit' id='submitBtn' value='SUBMIT' />
</form>

//JS
$("#s1").click(function () {
    document.getElementById("submitBtn").value = "Yes Clicked";
    return false;
});
$("#s2").click(function () {
    document.getElementById("submitBtn").value = "No Clicked";
    return false;
});