Question

我正在使用带有struts2-jQuery-plugin的Struts 2.3。

我必须使用ajax动态加载动作的结果在JSP中有一些普通的html和一个jQuery标签

<sj:datepicker cssClass="dataScadenzaDiv" id="dataScadenzaDiv"
        name="dataScadenza" maxDate="-1d" label="data scadenza"  theme="xhtml"/>

一切正常，用ajax注入的代码是：

<!-- lotto dpi -->
<tr>
<td class="tdLabel"><label for="lotto" class="label">Lotto:</label></td>
<td><input type="text" name="txtLotto" size="15" value="" id="lotto"/></td>
</tr>

<!-- tGestDataScadenza -->
<div id="dataScadenzaAjax"></div>
<input type="text" name="dataScadenza" value="" id="dataScadenzaDiv"     class="dataScadenzaDiv" theme="xhtml"/><script type='text/javascript'>
jQuery(document).ready(function () {
jQuery.struts2_jquery_ui.initDatepicker(false);
});
jQuery(document).ready(function () {
var options_dataScadenzaDiv = {};
options_dataScadenzaDiv.showOn = "both";
options_dataScadenzaDiv.buttonImage = "/RadioFrequenza2/struts     /js/calendar.gif";
options_dataScadenzaDiv.maxDate = "-1d";
options_dataScadenzaDiv.jqueryaction = "datepicker";
options_dataScadenzaDiv.id = "dataScadenzaDiv";
options_dataScadenzaDiv.name = "dataScadenza"; jQuery.struts2_jquery_ui.bind(jQuery('#dataScadenzaDiv'),options_dataScadenzaDiv    );

});
</script>

但现在<input type="text" name="dataScadenza">呈现为普通文本和点作为日期选择器。
我认为注入的javascript没有执行...

我该怎么办？

Answer 1

问题是struts2-jQuery-plugin正在生成一个在DOM准备就绪后运行的脚本：jQuery(document).ready(function () { ...

呈现页面后，将触发ready事件。但是在AJAX调用之后，它不是。

然后你有两个解决方案：

避免将struts2-jquery-plugin用于AJAX返回的JSP片段;使用简单的jQuery并避免使用jQuery(document).ready(function () {
_{（但我想它不会完全可靠）;}

使用技巧覆盖默认的jQuery ready事件as described in this great answer，以便ready函数可以触发。
然后将其作为AJAX返回的JSP片段的最后一行触发

<sj:datepicker cssClass="dataScadenzaDiv" id="dataScadenzaDiv"
               name="dataScadenza"        maxDate="-1d" 
               label="data scadenza"      theme="xhtml"/>
<script>
     $.triggerReady();
</script>

我做了一个小提示，并在jQuery 1.10.1中测试了它：

Running demo

HTML

<input type = "button" 
      value = "trigger ready event" 
    onclick = "$.triggerReady();" />

JAVASCRIPT

// Overrides jQuery-ready and makes it triggerable with $.triggerReady
// This script needs to be included before other scripts using the jQuery-ready.
// Tested with jQuery 1.10.1
(function(){
var readyList = [];

// Store a reference to the original ready method.
var originalReadyMethod = jQuery.fn.ready;

// Override jQuery.fn.ready
jQuery.fn.ready = function(){
if(arguments.length && arguments.length > 0 && typeof arguments[0] === 'function') {
  readyList.push(arguments[0]);
}

// Execute the original method.
originalReadyMethod.apply( this, arguments );
};

// Used to trigger all ready events
$.triggerReady = function() {
  $(readyList).each(function(){this();});
};
})();


/* This part is for demo only and should be removed */
$( document ).ready(function(){
    alert('document.ready is fired!');
});

请记住，最初在ready事件中运行的其他处理程序也会再次触发，因此请谨慎使用。

struts2，ajax和注入的jquery标记

1 个答案: