使用jquery更改div

更新：所以我把所有div放在一个表数据单元下。现在我可以在更改选择选项时获得所需的功能，但它显示全部页面加载时的div。我只是想让它显示我的预选{html_options name="program" options=$programs selected=$sanction->Program}使用jquery更改div

$ sanction->程序段引入了一个预选程序的字符串。它在初始选项集中选择实际选项，但该值不相应。它只显示每隔格。

上一个：我想隐藏我的div在jquery中，同时显示一个div。当我从六个选项中选择我的一个选项时，div显示出来，但是您可以清楚地看出它们在彼此之上的选择。我只想隐藏其他div，当我做出一个选择，只显示一个div。任何帮助，将不胜感激。

这里是我的代码

// JQUERY

 $("select[name=program]").change(function() { 
      $("td#levelCheck div").hide(); 
      $("td#levelCheck div#" + $(this).val()).show(); 
     });

// HTML

<table class="form" style="margin-top: 20px;"> 
      <tbody> 
       <tr> 
        <th>Sanction Name</th> 
        <td><input type="text" name="name" size="40" maxlength="100" value="{$sanction->Name}" /></td> 
       </tr> 
       <tr> 
        <th style="vertical-align: top;">Select discipline type</th> 
        <td>{html_options name="program" options=$programs selected=$sanction->Program}</td> 
       </tr> 
       <tr id="trCheck"> 
        <th></th> 
        <td id="levelCheck"> 
         <div id="Rhythmic" style="width: 452px;"> 
          {foreach from=$acroLevels item=level} 
           <label> 
            <input type="checkbox" name="{$level->Code}" value="{$level->Description}" /> {$level->Description} 
           </label> 
          {/foreach} 
         </div> 
         <div id="Acro" style="width: 452px;"> 
          {foreach from=$acroLevels item=level} 
           <label> 
            <input type="checkbox" name="{$level->Code}" value="{$level->Description}" /> {$level->Description} 
           </label> 
          {/foreach} 
         </div> 
         <div id="Men" style="width: 452px;"> 
          {foreach from=$mensLevels item=level} 
           <label> 
            <input type="checkbox" name="{$level->Code}" value="{$level->Description}" /> {$level->Description} 
           </label> 
          {/foreach} 
         </div> 
         <div id="TT" style="width: 452px;"> 
          {foreach from=$ttLevels item=level} 
           <label> 
            <input type="checkbox" name="{$level->Code}" value="{$level->Description}" /> {$level->Description} 
           </label> 
          {/foreach} 
         </div> 
         <div id="Women" style="width: 452px;"> 
          {foreach from=$womensLevels item=level} 
           <label> 
            <input type="checkbox" name="{$level->Code}" value="{$level->Description}" /> {$level->Description} 
           </label> 
          {/foreach} 
         </div> 
         <div id="Group" style="display: none;"> 
        </td> 
       </tr>

来源

2012-01-05 wowzuzz

以什么方式可以清楚地告诉他们他们彼此之间？用户体验或看到你不想让他们看到什么？没有一个工作的例子，它在首次检查时“看起来”确定。 – 2012-01-05 21:36:17

如果您在选择器中使用了一个ID，则不需要指定任何其他信息。它在文档中应该是唯一的。 '$（'＃'+ $（this）.val（））' – Andrew 2012-01-05 21:40:54

下拉选择器预先填充了一个来自我的控制器的值，该值显示与该选项关联的div。问题是我希望所有其他divs在突出显示一个选择时不显示。基本上，选择中有很多空间。我只想要一个div的有限的空间。 – wowzuzz 2012-01-05 21:41:03

你有相同的ID

<td id="levelCheck">

多个TD在这种情况下， jQuery会应用选择器使用#levelCheck只有第一个匹配的元素不是你所期望的。你应该改变它使用一个类，而不是

<td class="levelCheck">

然后用

$("td.levelCheck div")

来源

2012-01-05 21:52:02

把那个丑陋的表了。只需将所有div的素材放在一起，并将显示设置为无。你想要显示的那个，你将显示屏设置为阻止，所有其他设置为无。就是这样。

来源

2012-01-05 21:52:06

使用jquery更改div

回答

相关问题