Question

这是我的代码

按隐藏，然后按显示

<script type="text/javascript">
    var clic = 1;
    function hideFecha(){
        if (clic == 1){
            document.getElementById('fecha').style.display='none';
            clic = clic + 1;
        } else {
            document.getElementById('fecha').style.display = 'block';      
            clic = 1;
        }   
    }
</script>

//按隐藏，然后按显示

<script type="text/javascript">
    var click = 1;
    function hidePerson(){
        if (click == 1){
            document.getElementById('person').style.display='none';
            click = click + 1;}
        else{
            document.getElementById('person').style.display = 'block';      
            click = 1;
        }   
    }
</script>

我的表单

<g:form  controller="SoliCon" action="save" >
    <fieldset id="solContri" class="form">
        <div>
            <fieldset id="solContri" class="buttons">
                <center><input type="button" name="fecha" value="FECHA" onclick="hideFecha()"/></center>
            </fieldset>  
            <div id="fecha" >     
                <g:render  template="formfecha"/>
                <br>
            </div>
        </div>

时尚按钮隐藏div

        <div>
            <fieldset id="solContri" class="buttons">
                <input type="button" name="person"     value="PERSON"             onclick="hidePerson()"/>
            </fieldset>
            <div id="person">
                <g:render template="persona"/>
            </div>
        </div>
    </div>
</fieldset>
</g:form>

按隐藏然后按显示捕捉是当有两个或更多模板时javascript代码不起作用。

错误hidePerson is not defined，错误：hideFecha is not defined

Answer 1

您的代码存在一些问题。

1。）你有多个具有相同id的元素（solContri）

2。）你有一个额外的结束div标签

您收到的错误是由于重复的ID。

请参阅下面的代码。我相信这就是你追求的目标。

＆＃13;

$("#solContri-person").click(function(){
	$("#person").hide();
});

$("#solContri-fecha").click(function(){
	$("#fecha").hide();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<fieldset id="solContri" class="form">
  <div>
    <fieldset id="solContri-fecha" class="buttons">
      <center><input type="button" name="fecha" value="FECHA" /></center>
    </fieldset>  
    <div id="fecha" >     
      <br>
    </div>
  </div>
  <div>
    <fieldset id="solContri-person" class="buttons">
      <input type="button" name="person"     value="PERSON" />
    </fieldset>
    <div id="person">
<br/>
    </div>
  </div>
</fieldset>

＆＃13;

在表单中隐藏具有不同div Javascript的各种按钮

1 个答案: