0

我在我的页面中添加了一个简单的功能，用于在单击某些选项卡时隐藏/显示窗格。世界上最简单的事情，对吧？

在 Firefox 和 Chrome 中完美运行，但在 IE 中只能运行一半。它将隐藏所有 sopMonthContainers，但无法找到具有匹配 ID 的容器并显示它。

 $('.sopTab').click(function(e){
    if ($(this).hasClass("activeTab") === false){
        $(".sopTab").removeClass("activeTab");
        $(this).addClass("activeTab");
        };
    var selectionID = $(this).attr("id");
    $(".sopMonthContainer").css("display", "none");
    $(".sopMonthContainer#the"+selectionID).css("display", "block");
 });

我希望这不是我忽略的一些愚蠢的错字，但我已经盯着这个东西看了近一个小时，尝试不同的主题变化。我尝试修改选择器 ID 以确保它们是唯一的（因此最后一行选择器中的“the”），我尝试仅使用 ID 进行选择，我尝试使用不同的方法来隐藏/显示...无论如何，结果都是一样的。

编辑：相关标记。它有一些冷融合元素，## 之间的任何东西都是冷融合变量。

<div class="sopTab" id="sopContainer#DateFormat(pubdate,'mmmm')#" style="">
    #DateFormat(pubdate,"mmmm")#: <span id="sum#DateFormat(pubdate,"mmmm")#">0</span>
</div>

<cfoutput query="GetProductBasicInfo">
    <div class="sopMonthContainer" style="display:none;" 
    id="theSopContainer#DateFormat(pubdate,'mmmm')#">
        [div content goes here]
     </div>
</cfoutput>
4

3 回答 3

2

请注意，例如：

<div class="sopTab" id="sopContainerNovember" style="">November: <span id="sumNovember">0</span></div>

<div class="sopMonthContainer" style="display:none;" id="theSopContainerNovember">

当您单击 sopTab 时，您构建的选择器是

#thesopContainerNovember
//  ^

但目标的 ID 是

#theSopContainerNovember
//  ^

ID 不匹配（大写和小写s）

于 2012-09-18T14:57:19.187 回答
1

我认为最后一行应该是

$(".sopMonthContainer #the"+selectionID).css("display", "block");

这里应该有一个空间。但我可能错了。如果您发布指向 jsFiddle 或工作示例的链接，将会有所帮助。

于 2012-09-18T14:17:40.010 回答
0

您的页面中有错误。我注意到有一些代码看起来好像有人试图将其注释掉但没有正确执行。

在您的 sopQuery.cfm 文件中，在此处更改代码：

<script language="javascript">
<!--
  cfform_submit_status["productSelections"]=null;

  function check_TF_productSelections( theForm ){ 
    cfform_isvalid = true;
    cfform_error_message = "";
   cfform_invalid_fields = new Object();

    if ( cfform_isvalid ){
      return true;
    }else{
      alert( cfform_error_message );
      return false;
    }
  }

//-->
</script>

对此：

<!--
<script language="javascript">

  cfform_submit_status["productSelections"]=null;

  function check_TF_productSelections( theForm ){ 
    cfform_isvalid = true;
    cfform_error_message = "";
   cfform_invalid_fields = new Object();

    if ( cfform_isvalid ){
      return true;
    }else{
      alert( cfform_error_message );
      return false;
    }
  }


</script>
-->

或者...如果代码应该被取消注释，请将其更改为此，但请注意错误将持续存在，因为变量cfform_submit_status未在任何地方定义：

<script language="javascript">

  cfform_submit_status["productSelections"]=null;

  function check_TF_productSelections( theForm ){ 
    cfform_isvalid = true;
    cfform_error_message = "";
   cfform_invalid_fields = new Object();

    if ( cfform_isvalid ){
      return true;
    }else{
      alert( cfform_error_message );
      return false;
    }
  }


</script>

大概它应该在这里定义：

<script type="text/javascript" src="/bluedragon/scripts/cfform.js"></script>

但我看了看，那个文件是空的。

于 2012-09-18T14:40:09.327 回答