在表中啓用和禁用td

<td><select class="dropDownLists" name=reportFlag id="reportFlag" tabindex="10" style="WIDTH: 160px" onchange='onFocusReportingOptions();'> 
     <option value="Select">Select</option> 
     <option value="Y">Yes</option> 
     <option value="N">No</option> 
     </select>  
</td>

當我選擇選項是或否，下面的TD應顯示或不顯示給用戶。在表中啓用和禁用td

<td id="first_td"><select class="dropDownLists" name=reportingOption id="reportFlag" tabindex="10" style="WIDTH: 160px" onchange='callonChange();'> 
     <option value="Select">Select</option> 
     <option value="MyTell">Report via tool</option> 
     <option value="Manual">Report via manually</option> 
     </select> 
</td> 
<td id="second_td"><select class="dropDownLists" name=acctFlag id="acctFlag" tabindex="10" style="WIDTH: 160px" onchange='callonChange();'> 
     <option value="Select">Select</option> 
     <option value="Y">Yes</option> 
     <option value="N">No</option> 
     </select> 
</td>

我的問題是什麼是控制TD的顯示方式？我可以做的一種方式是使用DIV標籤，但如果我們使用Div標籤，我知道我們需要使用td內的表格，那麼對齊將會出現問題

任何人都可以用任何其他方式得到這個實施？

來源

2011-04-28 gmhk

給TD一個ID。然後使用Javascript隱藏具有相關ID的元素（通過CSS顯示屬性）。

<td id="first_td">content</td> 
<td id="second_id"><content</td> 

var elem = document.getElementById("first_td"); 
elem.style.display = "none";

TD隱藏或顯示的邏輯可以封裝在選擇下拉列表的事件處理程序中。

來源

2011-04-28 08:19:43

我按照您的迴應實施，當我在第一個選項中選擇否時，以下td id =「first_td」正在消失，但在該位置顯示id =「second_td」，另一個td不應該移動一旦我將first_td顯示爲none .. – gmhk 2011-04-28 08:48:05

您正在隱藏其中一個TD元素，因此另一個會移動。如果這讓表格看起來很奇怪，那麼給列中的每個TD一個類名稱並隱藏整個類 - 這將隱藏整個列，這應該阻止表看起來很奇怪。 – 2011-04-28 09:15:37

您是否使用表格進行佈局？使用的div像這樣：

DEMO

然後你就可以輕鬆地將其樣式您的需求。（定位等）

來源

2011-04-28 08:36:09 anothershrubery

您可以使用樣式可見性而不是顯示。

檢查此代碼，如果這符合您的需求。

CSS

.hiddenTD{ 
     visibility: hidden; 
    } 

    .visibleTD{ 
     visibility: visible; 
    }

function onFocusReportingOptions(val){ 
    var firstTD = document.getElementById('first_td'); 
    var secondTD = document.getElementById('second_td'); 

    if(val == 'Y') { 
     firstTD.className = "visibleTD"; 
     secondTD.className = "visibleTD"; 
    } else { 
     firstTD.className = "hiddenTD"; 
     secondTD.className = "hiddenTD";   
    } 

}

改變的東西在你的HTML

<td> 
     <select class="dropDownLists" name=reportFlag id="reportFlag" tabindex="10" style="WIDTH: 160px" onchange='onFocusReportingOptions(this.value);'> 
     <option value="Select">Select</option> 
     <option value="Y">Yes</option> 
     <option value="N">No</option> 
     </select>  
</td>

來源

2011-04-28 10:05:50 ace

我想你想模仿「禁用」（不隱藏）

$('td.YOUR CLASS').css('opacity', '0.5').click(function() { 
    event.preventDefault(); 
    return false; 
});

來源

2014-12-04 13:42:02

在表中啓用和禁用td

回答

相關問題