选项卡处于活动状态时隐藏和显示 div（选中）答案

【问题标题】：Hide and Show a div when a tab is active ( selected )选项卡处于活动状态时隐藏和显示 div（选中）
【发布时间】：2018-08-10 21:19:02
【问题描述】：

我已经建立了这个标签。

当我点击往返时，我想让那个 Flight 2 表格消失。

但由于多城市需要它，我希望它重新显示

多城市。

我用过这个

jQuery('#rdbOneWay').attr("class","onewaybuttonchecked");
jQuery('#rdbRoundTrip').attr("class","roundwaybuttonchecked");  
jQuery('#rdbMultiCity').attr("class","multiwaybuttonchecked");  

jQuery('.ret_date_block').attr("id","noreturndate");    


   $("#noreturndate").hide();
$(".onewaybuttonchecked").on("click", function(){
    $("#noreturndate").hide();
});

      $(".roundwaybuttonchecked").on("click", function(){
    $("#noreturndate").show();
});

          $(".multiwaybuttonchecked").on("click", function(){
    $("#noreturndate").show();
});

});

我用它来隐藏“单向”选项卡上的某些内容。如果：

$(".roundwaybuttonchecked").on("click", function(){
    $("#noreturndate").show();
});

如果我在这里使用航班 2 的正确 ID 将其隐藏在往返行程中，它会完成它的工作，但是当我在单程和往返行程之间切换时，它什么也不显示。当我从 Multi City 到 Round-Trip 时，这条线路开始运行。

有什么想法吗？

【问题讨论】：

标签： javascript jquery tabs show-hide

【解决方案1】：

你在这里肯定需要一个条件。

在您的 JQuery 函数中，尝试如下操作：

function radioButton() {
if (document.getElementById('htmlElement1').checked) {
    document.getElementById('htmlElement2').style.visibility = 'visible';
} else {
    document.getElementById('htmlElement').style.visibility = 'hidden';
}

请注意，由于我无法查看您的 HTML - 我不确定您使用的是什么元素，所以我说htmlElement 1 (or 2) 请用适当的元素填写。

让我知道你的结果！

【讨论】：

这里是链接：airlineticketcentre.ca，我试过了，但没用@jkimbrough
尝试像这样调整你的代码： $(".roundwaybuttonchecked").on("click", function(){ $("#noreturndate").hide(); });跨度>
我做了，但是当我从 One Way 切换到 Round 时，它会显示与 One Way 相同的布局。在我切换到 Multi-City 之后，代码就会触发，它就完成了。 $(".roundwaybuttonchecked").on("click", function(){ $("#pnlFlight2").show(); });
您的问题是“单向”的设置。查看您的申请时 - 目前将一种方式设置为往返...为什么您需要为一种方式返回航班？
我没有，我用上面的 jQuery 修复了它。我想使用与单程往返相同的逻辑，但它不起作用。

【解决方案2】：

没关系。

我使用与上面相同的代码

jQuery('#rdbOneWay').attr("class","onewaybuttonchecked");
jQuery('#rdbRoundTrip').attr("class","roundwaybuttonchecked");  
jQuery('#rdbMultiCity').attr("class","multiwaybuttonchecked");  

jQuery('.pnlFlight2').attr("id","pnlFlight2");  


   $("#pnlFlight2").hide();
$(".onewaybuttonchecked").on("click", function(){
    $("#pnlFlight2").hide();
});

      $(".roundwaybuttonchecked").on("click", function(){
    $("#pnlFlight2").hide();
});

          $(".multiwaybuttonchecked").on("click", function(){
    $("#pnlFlight2").show();
});

它成功了，我不知道为什么它之前没有工作，但很高兴现在可以了。

【讨论】：