使用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

回答

相關問題