vbscript禁用/启用html输入

时间：2013-03-05 23:02:30

标签： html vbscript radio-button hta

我已经在这个工作了几天，但我仍然没有想到它。我有一个HTML页面，有两组输入，每个输入包括一个单选按钮和一些文本。我需要：

  • 页面加载时要禁用的所有文本输入
  • 单选按钮＃1启用文本输入并禁用单选按钮＃2
    • 的文本输入
  • 单选按钮＃2启用文本输入并禁用单选按钮＃1
    • 的文本输入

以下是一些示例代码：

<html>

<script type="text/vbscript">
<!--<![CDATA[
function enable()
    if document.GetElementByID("radio1").checked then
        document.GetElementByID("radio2").checked = false
        document.GetElementByID("text1").disabled = false
        document.GetElementByID("text2").disabled = true
    elseif document.GetElementByID("radio2").checked then
        document.GetElementByID("radio1").checked = false
        document.GetElementByID("text1").disabled = true
        document.GetElementByID("text2").disabled = false
    else
        document.GetElementByID("text1").disabled = true
        document.GetElementByID("text2").disabled = true
    end if
end function
-->]]>
</script>

<body onload="enable()">
    <table border=1>
        <tr>
            <td>
                <input type="radio" id="radio1" name="radio1" value="radio1" onclick="enable()">
                <label for="radio1" >
                    Radio 1
                </label>
            </td>
            <td>
                <input type="text" id="text1" name="text1" value="hi">
            </td>
        </tr>
        <tr>
            <td>
                <input type="radio" id="radio2" name="radio2" value="radio2" onclick="enable()">
                <label for="radio2" >
                    Radio 2
                </label>
            </td>
            <td>
                <input type="text" id="text2" name="text2" value="bye">
            </td>
        </tr>
    </table>
</body>

</html>

看起来我可以让它部分工作，但不是一直都可以。最后，这将以HTA形式结束。

编辑：

感谢@kingdomcreation和@Teemu，我现在可以为任意数量的单选按钮提供这个工作解决方案：

<html>

    <script type="text/vbscript">
        <!--<![CDATA[
        function enable(num)
            document.getElementById("text" & num).disabled = false

            for i = 1 to 6
                if document.getElementById("radio" & i).checked = false Then
                    document.getElementById("text" & i).disabled = true
                end if
            next
        end function
        -->]]>
    </script>

    <body>
        <table border=1>
            <tr>
                <td>
                    <input type="radio" id="radio1" name="radio" value="radio1" onClick="enable(1)">
                    <label for="radio1" >
                        Radio 1
                    </label>
                </td>
                <td>
                    <input disabled type="text" id="text1" name="text1" value="hi">
                </td>
            </tr>
            <tr>
                <td>
                    <input type="radio" id="radio2" name="radio" value="radio2" onClick="enable(2)">
                    <label for="radio2" >
                        Radio 2
                    </label>
                </td>
                <td>
                    <input disabled type="text" id="text2" name="text2" value="there">
                </td>
            </tr>
            <tr>
                <td>
                    <input type="radio" id="radio3" name="radio" value="radio3" onClick="enable(3)">
                    <label for="radio3" >
                        Radio 3
                    </label>
                </td>
                <td>
                    <input disabled type="text" id="text3" name="text3" value="how">
                </td>
            </tr>
            <tr>
                <td>
                    <input type="radio" id="radio4" name="radio" value="radio4" onClick="enable(4)">
                    <label for="radio4" >
                        Radio 4
                    </label>
                </td>
                <td>
                    <input disabled type="text" id="text4" name="text4" value="are">
                </td>
            </tr>
            <tr>
                <td>
                    <input type="radio" id="radio5" name="radio" value="radio5" onClick="enable(5)">
                    <label for="radio5" >
                        Radio 5
                    </label>
                </td>
                <td>
                    <input disabled type="text" id="text5" name="text5" value="you">
                </td>
            </tr>
            <tr>
                <td>
                    <input type="radio" id="radio6" name="radio" value="radio6" onClick="enable(6)">
                    <label for="radio6" >
                        Radio 6
                    </label>
                </td>
                <td>
                    <input disabled type="text" id="text6" name="text6" value="bye">
                </td>
            </tr>
        </table>
    </body>
</html>

4 个答案:

答案 0 :(得分：2)

这是一个有效的vbscript示例，我看看我能做些什么来使它在vbscript中工作（在客户端上）

  • 无线电ID可以识别点击的那个，但是可以选择表现类似选项（当点击一个，另一个被取消选中时）名称属性必须相同。

  • vb代码位于

    • 下

  • 功能代码已更改为vb syntax

  • 已删除document.GetElementByID

如果你想做客户端vbscript，我希望这清楚一些事情...顺便说一句，只有IE appart中的支持者能够为其他浏览器添加扩展。 

<html>


<body onLoad="enable()">
<table border=1>
    <tr>
        <td>
            <input type="radio" id="radio1" name="radio" value="radio1" onClick="enable()">
            <label for="radio1" >
                Radio 1
            </label>
        </td>
        <td>
            <input type="text" id="text1" name="text1"  disabled value="hi">
        </td>
    </tr>
    <tr>
        <td>
            <input type="radio" id="radio2" name="radio"  value="radio2" onClick="enable()">
            <label for="radio2" >
                Radio 2
            </label>
        </td>
        <td>
            <input type="text" id="text2" name="text2" disabled value="bye">
        </td>
    </tr>
</table>

<script type="text/vbscript">
<!--<![CDATA[
Function enable()
If radio1.checked = true Then
    radio2.checked = false
    text1.disabled = false
    text2.disabled = true
ElseIf radio2.checked = true Then
    radio1.checked = false
    text1.disabled = true
    text2.disabled = false
 Else
    text1.disabled = true
    text2.disabled = true
 End If
End Function
-->]]>
</script>
</body>

</html>

答案 1 :(得分：1)

您可以在html中的输入上写入disabled属性，以便默认情况下禁用它们（在加载时）

答案 2 :(得分：1)

如果你真的只有两个按钮，那就可以了。请注意两个单选按钮的name相同。这样，您可以将单选按钮组合在一起，而无需单独选中/取消选中它们。 onload()也变得毫无用处。

function enable(id)
    document.getElementById("text" & id).disabled = false
    document.getElementById("text" & id * -1).disabled = true
end function

<input id="radio1" name="radio" type="radio" value="radio1" onclick="enable(1)" />
<input id="text1" name="text1" type="text" value="hi" disabled />
                        :
<input id="radio2" name="radio" type="radio" value="radio2" onclick="enable(-1)" />
<input id="text-1" name="text2" type="text" value="bye" disabled />

答案 3 :(得分：0)

我可以提出类似的建议。 

<html>

<script>
<!--<![CDATA[
function enable(){
    if( document.getElementById("radio1").checked){
        document.getElementById("radio2").checked = false
        document.getElementById("text1").disabled = false
        document.getElementById("text2").disabled = true
    }else if( document.getElementById("radio2").checked){
        document.getElementById("radio1").checked = false
        document.getElementById("text1").disabled = true
        document.getElementById("text2").disabled = false
    }else{
        document.getElementById("text1").disabled = true
        document.getElementById("text2").disabled = true
    }
}
-->]]>
</script>

<body onload="enable()">
    <table border=1>
        <tr>
            <td>
                <input type="radio" id="radio1" name="radio" value="radio1" onclick="enable()">
                <label for="radio1" >
                    Radio 1
                </label>
            </td>
            <td>
                <input type="text" id="text1" name="text1" value="hi">
            </td>
        </tr>
        <tr>
            <td>
                <input type="radio" id="radio2" name="radio" value="radio2" onclick="enable()">
                <label for="radio2" >
                    Radio 2
                </label>
            </td>
            <td>
                <input type="text" id="text2" name="text2" value="bye">
            </td>
        </tr>
    </table>
</body>

</html>
相关问题
最新问题