1

私のコードです

<div class="rButtons">
<input type="radio" name="numbers" value="10" onclick="uncheck();" />10
<input type="radio" name="numbers" value="20"  onclick="uncheck();" />20
<input type="radio" name="numbers" value="other" onclick="check(this);"/>other
<input type="text" id="other_field" name="other_field" onblur="checktext(this);"/>
</div>

これはcssコードです

<style type="text/css">
#other_field
{
visibility: hidden;
}
</style>

これはjsです

<script type="text/javascript">
function uncheck()
 {
   document.getElementById('other_field').style.visibility = "hidden";
 }
function check(inputField)
{
    if(inputField.checked)
    {
        document.getElementById('other_field').style.visibility = "visible";
    }
}
function checktext(inputField)
{
    if(isNaN(inputField.value))
    {
        alert('only numbers are allowed..');
        return false;
    }
    else if( (inputField.value % 10 ) != 0)
    {
        alert('only multiples of 10..');
        return false;
    }
    else
    {
        return true;
    }

}
</script>

すべてが順調です..しかし問題はこれです..[その他]ラジオボタンをクリックすると新しい空白のフィールドが開きますが、10または20に戻るとそこにとどまります..これを非表示にするにはどうすればよいですか？

私は答えが簡単であることを知っています..しかし、私は多くのことを試みましたが、うまくいきませんでした..

ありがとう

4

2 に答える 2

0

これは、JQueryを使用して行うことができます。

<script>
 var $radios = $('input:radio[name=numbers]');
        if ($radios.is(':checked') === true) {
           $("#other_field").show();
        }     
        else
        {
           $("#other_field").hide();
        }   

</script>
于 2013-01-23T14:41:29.400 に答える
0

あなたのための完全なコード：

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2"></script>

<script type="text/javascript">

    function ShowTextBox()
    {
        if ($("input[name=radiobutton1]:checked").val() == "show")      
        {       
           $("#text_box_to_show").show();
        }     
        else
        {
           $("#text_box_to_show").hide();
        }   
    }

</script>
</head>

<body>
<h3>Example</h3>
  <input name="radiobutton1" type="radio" value="show" onChange="ShowTextBox();">Show
  <input name="radiobutton1" type="radio" value="hide" checked onChange="ShowTextBox();">Hide
  <input type="text" id="text_box_to_show" name="textfield" style="display:none;">
</body>
</html>
于 2013-01-23T21:10:57.643 に答える