Question

我在Jquery中很新，因为我只使用javascript。

我尝试执行jquery函数，但它只执行代码中的第一个条件（第一个IF）。第二个（第二个IF）从未执行过。我一定有问题，如果有明显的事情，我道歉。下一个代码是嵌入到visualforce页面中的Jquery函数（这就是为什么组件的语法ID）。

$(function() {
$( "#datepicker" ).datepicker({ dateFormat: 'dd/mm/yy' });
$( "#datepicker2" ).datepicker({ dateFormat: 'dd/mm/yy' });
if(document.getElementById('{!$Component.mainform.inputDATE}').value != null){
    var obj = document.getElementById('{!$Component.mainform.inputDATE}').value;
    $( "#datepicker" ).val(obj);
    alert("obj: "+obj);
}
if(document.getElementById('{!$Component.mainform.inputDATE2}').value != null){
    var obj2 = document.getElementById('{!$Component.mainform.inputDATE2}').value;
    $( "#datepicker2" ).val(obj2);
    alert("obj2: "+obj2);
}    
});

任何建议都会非常感激。我以不同的方式测试，但只执行了第一个条件。

Answer 1

感谢您的评论，我发现jquery函数没有问题。这个问题实际上与visualforce有关。在visualforce页面中，我可以将其划分为多个部分，并根据特定功能进行渲染。例如：

 <apex:outputpanel rendered="{!objOrder.Id!=''}"  >   
   <apex:inputHidden id="inputDATE" value=" {!objOrder.Required_Date__c}" />           
   <input type="text" id="datepicker"/>
 </apex:outputpanel>

 <apex:outputpanel rendered="{!objOrder.Id==''}"  >   
   <apex:inputHidden id="inputDATE2" value=" {!objOrder.Required_Date__c}" />           
   <input type="text" id="datepicker2"/>
 </apex:outputpanel>

所以，我假设页面顶部的Jquery函数无法识别其中一个输入是否会被渲染，而且它永远不会工作第二个条件（第一个条件更常见）< / p>

$(function() {
$( "#datepicker" ).datepicker({ dateFormat: 'dd/mm/yy' });
$( "#datepicker2" ).datepicker({ dateFormat: 'dd/mm/yy' });
if(document.getElementById('{!$Component.mainform.inputDATE}').value != null){
   var obj = document.getElementById('{!$Component.mainform.inputDATE}').value;
   $( "#datepicker" ).val(obj);
   alert("obj: "+obj);
}
if(document.getElementById('{!$Component.mainform.inputDATE2}').value != null){
   var obj2 = document.getElementById('{!$Component.mainform.inputDATE2}').value;
   $( "#datepicker2" ).val(obj2);
   alert("obj2: "+obj2);
}    
});

所以，如果不遵循最佳实践，我所做的并道歉，将jquery函数分为两部分并嵌入属于的部分。以这种方式，它将执行两个功能。最终的代码就是这个：

 <apex:outputpanel rendered="{!objOrder.Id!=''}"  >   
   <apex:inputHidden id="inputDATE" value=" {!objOrder.Required_Date__c}" />           
   <input type="text" id="datepicker"/>
   <script>
$(function() {
$( "#datepicker" ).datepicker({ dateFormat: 'dd/mm/yy' });
if(document.getElementById('{!$Component.mainform.inputDATE}').value != null){
   var obj = document.getElementById('{!$Component.mainform.inputDATE}').value;
   $( "#datepicker" ).val(obj);
   alert("obj: "+obj);
}
}); 
   </script>
 </apex:outputpanel>

 <apex:outputpanel rendered="{!objOrder.Id==''}"  >   
   <apex:inputHidden id="inputDATE2" value=" {!objOrder.Required_Date__c}" />           
   <input type="text" id="datepicker2"/>
   <script>
   $(function() {
   $( "#datepicker2" ).datepicker({ dateFormat: 'dd/mm/yy' });
   if(document.getElementById('{!$Component.mainform.inputDATE2}').value != null){
   var obj2 = document.getElementById('{!$Component.mainform.inputDATE2}').value;
   $( "#datepicker2" ).val(obj2);
   alert("obj2: "+obj2);
}    
}); 
   </script>
 </apex:outputpanel>

我希望这可以帮助将来面对salesforce render和jquery之间的问题。

感谢您的帮助...... !!!

JQuery / Javascript只执行第一个条件（在带有apex：outputpanel的visualforce页面中）

1 个答案: