2017-09-24 56 views
1

我想使用dojo中最接近的方法来找出我想要显示/隐藏基于在筛选select其中之一选择的值的元素的第一个父。它在Firefox浏览器中工作正常,但在IE中它说Object不支持最接近。这里的任何帮助真的很感激。下面给出的是html和js代码的示例。dojoquery与最接近的方法不工作在Internet Explorer中

HTML

<div class="pvrProperty pvrLayoutItem pvrPropertyRequired" id="pvr_widget_Property_3" widgetId="pvr_widget_Property_3"> 
<label class="pvrPropertyLabel" id="pvr_widget_Property_3_label" for="pvr_widget_editors_FilteringSelectEditor_0" data-dojo-attach-point="_labelNode">Product Type</label> 
<div class="pvrPropertyEditor" data-dojo-attach-point="_editorNode"> 
<div class="dijitReset dijitInline idxComposite idxFilteringSelectWrap dijitValidationTextBox idxFilteringSelectWrapRequired dijitValidationTextBoxRequired dijitRequired idxFilteringSelectWrapIncomplete dijitValidationTextBoxIncomplete dijitIncomplete idxFilteringSelectWrapIncompleteRequired dijitValidationTextBoxIncompleteRequired dijitIncompleteRequired pvrEditor pvrFilteringSelectEditor" id="widget_pvr_widget_editors_FilteringSelectEditor_0" widgetId="pvr_widget_editors_FilteringSelectEditor_0"> 
</div> 
</div> 
</div> 
<div class="pvrProperty pvrLayoutItem pvrPropertyRequired" id="pvr_widget_Property_4" widgetId="pvr_widget_Property_4"> 
<label class="pvrPropertyLabel" id="pvr_widget_Property_4_label" for="pvr_widget_editors_FilteringSelectEditor_1" data-dojo-attach-point="_labelNode">Document Type</label> 
<div class="pvrPropertyEditor" data-dojo-attach-point="_editorNode"> 
<div class="dijitReset dijitInline idxComposite idxFilteringSelectWrap dijitValidationTextBox idxFilteringSelectWrapRequired dijitValidationTextBoxRequired dijitRequired idxFilteringSelectWrapIncomplete dijitValidationTextBoxIncomplete dijitIncomplete idxFilteringSelectWrapIncompleteRequired dijitValidationTextBoxIncompleteRequired dijitIncompleteRequired pvrEditor pvrFilteringSelectEditor" id="widget_pvr_widget_editors_FilteringSelectEditor_1" widgetId="pvr_widget_editors_FilteringSelectEditor_1"> 
</div> 
</div> 
</div> 
<div class="pvrProperty pvrLayoutItem pvrPropertyRequired" id="pvr_widget_Property_5" widgetId="pvr_widget_Property_5"> 
<label class="pvrPropertyLabel" id="pvr_widget_Property_5_label" data-dojo-attach-point="_labelNode">Document Type Others</label> 
<div class="pvrPropertyEditor" data-dojo-attach-point="_editorNode"> 
<input type="textbox"></input> 
</div> 
</div> 

的Javascript:

query(".pvrPropertyLabel").forEach(function(node){ 
     var labelName=node.innerHTML; 
     if(labelName=="Document Type"){ 
      alert("lableName"+labelName); 
      filtertingSelectId=domAttr.get(node,"for"); 
      var temp=dijit.byId(filtertingSelectId).get('value'); 
      alert("value of filtering select is:"+temp); 
     } 
     else if(labelName=="Document Type Others"){ 
      alert("lableName"+labelName); 
      //alert("query(labelNodes[i])"+query(labelNodes[i])); 
      alert("equality test"+node===query(node)); 
      var parentNode=query(node).closest(".pvrProperty");/*node.closest(".pvrProperty") works fine here but not query(node)*/ 
      var spanNode=query(node).closest(".pvrPropertyLabelWrapper"); 
      domStyle.set(spanNode,{"width":"175px"}); 
      var propEditnode=dijit.byId(filtertingSelectId); 
      alert("parentNode:"+parentNode); 
      alert("parentNode id"+domAttr.get(parentNode,"id")); 
      //var dropdownId=domAttr.get(labelNodes[i],"for"); 
      if(propEditnode.get('value')=="Other"){ 
       alert("other"); 
       domClass.remove(parentNode,"pvrLayoutItemHidden"); 
       domClass.remove(parentNode,"pvrPropertyHidden"); 
       domClass.add(parentNode,"pvrLayoutItem"); 
      }else{ 
       alert("not other"); 
       domClass.add(parentNode,"pvrLayoutItemHidden"); 
       domClass.add(parentNode,"pvrPropertyHidden"); 
       domClass.remove(parentNode,"pvrLayoutItem"); 
      } 
     } 
    }); 

即使我试图平等的测试,以检查是否两个节点都是相同的或没有,但他们是not.If我做简单的node.closest( '' )在上面的代码在Firefox中工作正常,但是当我使用查询(节点).closest('')也不能在Firefox中工作。不知道我在这里错过了什么。任何帮助真的很感激。谢谢

+0

哪个版本的IE? –

+0

我正在使用IE 11.0版本 –

+0

不得不添加polyfill为最接近IE的方法来支持它。这使得它也适用于IE,但我想知道这是否正确。 –

回答

0

我不得不使用polyfill为IE浏览器支持最接近的方法。下面的代码解决了我的问题。希望这可以帮助面临类似问题的人。

 if (window.Element && !Element.prototype.closest) { 
       Element.prototype.closest = 
       function(s) { 
        var matches = (this.document || this.ownerDocument).querySelectorAll(s), 
         i, 
         el = this; 
        do { 
         i = matches.length; 
         while (--i >= 0 && matches.item(i) !== el) {}; 
        } while ((i < 0) && (el = el.parentElement)); 
        return el; 
       }; 
      } 
     query(".pvrPropertyLabel").forEach(function(node){ 
      var labelName=node.innerHTML; 
      if(labelName=="Document Type"){ 
       //alert("lableName"+labelName); 
       filtertingSelectId=domAttr.get(node,"for"); 
       var temp=dijit.byId(filtertingSelectId).get('value'); 
       //alert("value of filtering select is:"+temp); 
      } 
      else if(labelName=="Document Type Others"){ 
       //alert("lableName"+labelName); 
       //alert("query(labelNodes[i])"+query(labelNodes[i])); 
       var lableId=domAttr.get(node,"id"); 
       //alert("labelId:"+lableId); 
       var parentNode=node.closest(".pvrProperty"); 
       var spanNode=node.closest(".pvrPropertyLabelWrapper"); 
       domStyle.set(spanNode,{"width":"175px"}); 
       var propEditnode=dijit.byId(filtertingSelectId); 
       //alert("parentNode:"+parentNode); 
       //var dropdownId=domAttr.get(labelNodes[i],"for"); 
       if(propEditnode.get('value')=="Other"){ 
        domClass.remove(parentNode,"pvrLayoutItemHidden"); 
        domClass.remove(parentNode,"pvrPropertyHidden"); 
        domClass.add(parentNode,"pvrLayoutItem"); 
       }else{ 
        domClass.add(parentNode,"pvrLayoutItemHidden"); 
        domClass.add(parentNode,"pvrPropertyHidden"); 
        domClass.remove(parentNode,"pvrLayoutItem"); 
       } 
      } 
     }); 
相关问题