Div 不会使用 jquery 显示（）答案

【问题标题】：Div won't show() using jqueryDiv 不会使用 jquery 显示（）
【发布时间】：2012-11-04 10:20:25
【问题描述】：

我遇到了一个非常奇怪的问题。如果您单击类：“change_btn”，我想显示一个特定的 div。但唯一有效的是密码形式（passwordFC）。当我单击其他按钮时，什么都看不到。他们有内容。这怎么可能？

我已经尝试了几个小时，感谢任何帮助。

最好的问候吉米

jQuery

jQuery(function($) {

    /* Make the password form show first as standard */
    $(".settingsFC").hide();
    $(".passwordFC").show();

    /* Function that shows the right form when clicking the buttons */

    $(".change_btn").click(function() { 

        $choosenForm = "." + $(this).attr("title"); 

        /* Remove the style on the other buttons */
        $(".settingButton").css('background-color','#ebeaea');
        $(".settingButton").css('font-weight','normal');

        /* Add style to clicked button */
        $(this).css('background-color','#e0e0e0');
        $(this).css('font-weight','bold');

        /* Hide the other containers, if i remove this they show when clicking. */
        $(".settingsFC").hide();

        /* Tried this one as well, didnt work */
        //$(".settingsFC:not(."+$choosenForm+")").hide();

        /* Show the right container */
        $($choosenForm).show();

    });
});

HTML

<div title="passwordFC"  class="settingButton px10 change_btn firstSettingsChoice"> INLOGGNING </div>
<div title="personalFC" class="settingButton px10 change_btn"> PERSONLIGT </div>
<div title="paymentFC"  class="settingButton px10 change_btn"> BETALNINGSPLAN </div>
<div title="cloudFC"  class="settingButton px10 change_btn"> CLOUD INSTÄLLNINGAR </div>


<div class="settingsFC passwordFC">
    <?php include("includes/changeSettings/changePassword.php"); ?>
</div> <!-- changePassword -->

<div class="settingsFC personalFC">
    <?php include("includes/changeSettings/changePersonal.php"); ?>
</div> <!-- changePersonal -->

<div class="settingsFC paymentFC">
    <?php include("includes/changeSettings/changePayment.php"); ?>
</div> <!-- changePayment -->

<div class="settingsFC cloudFC">
    <?php include("includes/changeSettings/changeCloud.php"); ?>
</div> <!-- changeCloud -->

【问题讨论】：

看起来它正在工作...jsfiddle.net/ptkdU也许您包含的 PHP 代码有问题？
对我来说很好。 See here
你们是对的，我删除了 php 代码，现在一切正常。很奇怪，包含文件只有一个表格。我去看看，谢谢！
如果包含的代码包含无效的 HTML（例如关闭 </div> 标记），可能会导致意外行为。

标签： jquery class html hide show

【解决方案1】：

这是您需要做的。工作小提琴（删除 PHP 内容进行测试）-fiddle

$(document).ready(function() {

  /* Make the password form show first as standard */
  $(".settingsFC").hide();
  //$(".passwordFC").show();


  /* Function that shows the right form when clicking the buttons */

  $(".change_btn").click(function() { 

         var choosenForm = "." + $(this).attr("title"); 

         /* Remove the style on the other buttons */
         $(".settingButton").css('background-color','#ebeaea');
         $(".settingButton").css('font-weight','normal');

         /* Add style to clicked button */
         $(this).css('background-color','#e0e0e0');
         $(this).css('font-weight','bold');

         /* Hide the other containers, if i remove this they show when clicking. */
          $(".settingsFC").hide();

         /* Tried this one as well, didnt work */
         //$(".settingsFC:not(."+$choosenForm+")").hide();

         /* Show the right container */
         $(choosenForm).show();

    });
});

【讨论】：

OP 发布的代码似乎工作得很好，所以我不确定你在这里“修复”了什么。除了隐藏.passwordFC，我认为他们希望看到它，因为他们明确地让它可见。