[英]How can I hide a table row based on selection made in dropdown
我有一个下拉菜单,当在另一行的下拉菜单中选择“法国”时,我想隐藏该菜单。 我想隐藏整个行,以便隐藏County和下拉菜单。 以下是我尝试过的CSS,JS,以及在JSFiddle中指向它的链接。
<table>
<tr>
<td class="BBFieldCaption DonationCaptureFieldCaption" id="PC1920_DonationCapture1_AddressCtl_lbl_country">
<label id="PC1920_DonationCapture1_AddressCtl_lblCountry" for="PC1920_DonationCapture1_AddressCtl_dd_Country">Country:</label>
</td>
<td>
<select class="BBFormSelectList DonationCaptureSelectList" id="PC1920_DonationCapture1_AddressCtl_dd_Country" onchange="javascript:setTimeout('__doPostBack(\'PC1920$DonationCapture1$AddressCtl$dd_Country\',\'\')', 0)" name="PC1920$DonationCapture1$AddressCtl$dd_Country">
<option value=""></option>
<option value="Australia">Australia</option>
<option value="Bahamas">Bahamas</option>
<option value="Bermuda">Bermuda</option>
<option value="Canada">Canada</option>
<option value="France" selected="selected">France</option>
<option value="Germany">Germany</option>
<option value="Italy">Italy</option>
</select>
</td>
</tr>
<tr>
<td class="BBFieldCaption DonationCaptureFieldCaption" id="PC1920_DonationCapture1_AddressCtl_lbl_countyUK">
<label id="PC1920_DonationCapture1_AddressCtl_lblCountyUK" for="PC1920_DonationCapture1_AddressCtl_dd_CountyUK">County:</label>
</td>
<td class="taLeft BBFieldControlCell DonationCaptureFieldControlCell" id="PC1920_DonationCapture1_AddressCtl_ctl_countyUK">
<select class="BBFormSelectList DonationCaptureSelectList" id="PC1920_DonationCapture1_AddressCtl_dd_CountyUK" name="PC1920$DonationCapture1$AddressCtl$dd_CountyUK">
<option value="" selected="selected"></option>
<option value="Alcorn">Alcorn</option>
<option value="Alexander">Alexander</option>
</select>
</td>
</tr>
</table>
我尝试通过添加以下内容来使用jquery进行此操作,但无法使其正常工作:
$(document).ready(function() {
$('#PC1920_DonationCapture1_AddressCtl_dd_Country').change(function() {
PC1920$DonationCapture1$AddressCtl$dd_Country = $('#PC1920_DonationCapture1_AddressCtl_dd_Country').val();
$('PC1920_DonationCapture1_AddressCtl_ctl_countyUK').hide();
if (PC1920$DonationCapture1$AddressCtl$dd_Country == 'France')
{
$('PC1920_DonationCapture1_AddressCtl_ctl_countyUK').hide();
}
});
});
我没有直接访问表单的HTML的权限,这是使用CMS系统的。 我也将此添加到JSFiddle,任何帮助将不胜感激。 谢谢! 在这里查看JSFiddle: http : //jsfiddle.net/jelane20/qG2bT/7/
您似乎在选择器中缺少#。 更改
if (PC1920$DonationCapture1$AddressCtl$dd_Country == 'France')
{
$('PC1920_DonationCapture1_AddressCtl_ctl_countyUK').hide();
}
至
if (PC1920$DonationCapture1$AddressCtl$dd_Country == 'France')
{
$('#PC1920_DonationCapture1_AddressCtl_ctl_countyUK').hide();
}
试试这样的事情-
$(document).ready(function () {
$('#PC1920_DonationCapture1_AddressCtl_dd_Country').change(function () {
$(this).parents('tr').next().toggle($(this).val() !== "France");
});
});
在这里摆弄
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.