如何在 XMLHttpRequest 之后调用 nicEdit（编辑框）或 jquery（文本框的日期选择器）？

Question

需要帮助（或示例），因为我在使用 XMLHttpRequest 时似乎无法调用 jquery datepick 或 nicEdit。

我的代码带有 4 个 php 文件：

<p>Main page:&nbsp;main.php<br />
  ++++++++++++++++++<br />
  &lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;&gt;<br />
  &lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;<br />
  &lt;head&gt;<br />
  &lt;meta http-equiv=&quot;content-type&quot; content=&quot;text/html; charset=utf-8&quot; /&gt;<br />
  &lt;title&gt;Education Centre&lt;/title&gt;<br />
  &lt;link href=&quot;style.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; media=&quot;screen&quot; /&gt;<br />
  &lt;script type=&quot;text/javascript&quot; src=&quot;script.js&quot;&gt;&lt;/script&gt;<br />
  &lt;script type=&quot;text/javascript&quot; src=&quot;mainjs.js&quot;&gt;&lt;/script&gt;<br />
  &lt;script src=&quot;http://js.nicedit.com/nicEdit-latest.js&quot; type='text/javascript'&gt;&lt;/script&gt;<br />
  &lt;script type=&quot;text/javascript&quot;&gt;bkLib.onDomLoaded(nicEditors.allTextAreas);&lt;/script&gt;</p>
<p>&lt;/head&gt;<br />
  &lt;body onLoad=&quot;init_table();&quot;&gt;<br />
  &lt;div id=&quot;page&quot;&gt;<br />
  &lt;form name='form1'&gt;<br />
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;<br />
  &lt;div id=&quot;content&quot;&gt;<br />
  &lt;div id=&quot;showTable&quot;&gt;        &lt;/div&gt;<br />
  &lt;/div&gt;<br />
  &lt;/form&gt;<br />
  &lt;/div&gt;<br />
  &lt;!-- end page --&gt;<br />
  &lt;/body&gt;<br />
  &lt;/html&gt;<br />
</p>
<br />


<p>mainjs.js<br />
  +++++++++<br />
  function init_table() {<br />
  requestInfo('showMain.php?mode=list&amp;prev_cid=1','showTable','');<br />
  }</p>
<p>&nbsp;</p>
<p>script.js [copied and tested to be ok with other pages]<br />
  +++++++++++++++++++++++++++++++++++++++++++++++++++++++<br />
  function getHTTPObject() {<br />
  var xmlhttp;<br />
  <br />
  if(window.XMLHttpRequest){<br />
  xmlhttp = new XMLHttpRequest();<br />
  }<br />
  else if (window.ActiveXObject){<br />
  xmlhttp=new ActiveXObject(&quot;Microsoft.XMLHTTP&quot;);<br />
  if (!xmlhttp){<br />
  xmlhttp=new ActiveXObject(&quot;Msxml2.XMLHTTP&quot;);<br />
  }<br />
  <br />
  }<br />
  return xmlhttp;<br />
  }</p>
<p>var http = getHTTPObject(); // We create the HTTP Object</p>
<p>function requestInfo(url,id,redirectPage) { <br />
  var temp=new Array();<br />
  http.open(&quot;GET&quot;, url, true);<br />
  http.onreadystatechange = function() {<br />
  if (http.readyState == 4) {<br />
  if(http.status==200) {<br />
  var results=http.responseText;<br />
  if(redirectPage==&quot;&quot; || results!=&quot;1&quot;) {<br />
  var temp=id.split(&quot;~&quot;); // To display on multiple div <br />
  var r=results.split(&quot;~&quot;); // To display multiple data into the div <br />
  if(temp.length&gt;1) {<br />
  for(i=0;i&lt;temp.length;i++) { <br />
  document.getElementById(temp[i]).innerHTML=r[i];<br />
  }<br />
  } else {<br />
  document.getElementById(id).innerHTML = results;<br />
  } <br />
  <br />
  } else {<br />
  window.location.href=redirectPage; <br />
  }<br />
  } <br />
  }<br />
  };<br />
  http.send(null);<br />
  }<br />
</p>

<br />
<p>showMain.php<br />
  ++++++++++++<br />
  &lt;?php<br />
header('Content-Type: text/xml');</p>
<p>//include(&quot;config.php&quot;);<br />
  //include(&quot;mysql.lib.php&quot;);<br />
  //$obj=new connect;<br />
  <br />
  $netwkinfo = &quot;Some information pulled from database&quot;;<br />
  echo &quot;&lt;table&gt;&quot;;<br />
  echo &quot;&lt;tr&gt;&lt;td&gt;My Data&lt;/td&gt; &lt;td&gt;&lt;textarea id='netwkinfo' cols='75' rows='5' &gt;&quot; . $netwkinfo . &quot;&lt;/textarea&gt;&lt;/td&gt;&lt;/tr&gt;&quot;;<br />
  echo &quot;&lt;/tr&gt;&quot;;<br />
  echo &quot;&lt;/table&gt;&quot;;<br />
  ?&gt;<br />
</p>

showMain.php 是一个从数据库中提取数据以进行显示/编辑等的文件...但为了简单起见，我为 $netwkinfo 分配了一个值。

我希望看到的是编辑框中显示的 nicEdit 功能（面板）。 不幸的是我没有看到它，只出现一个普通的编辑框。 可能出了什么问题，我应该如何纠正它才能正常工作。

类似地 IF 我在 showmain.php 的文本框中使用了 jquery datepicker，我也没有看到它工作。 我认为这是相同的概念，但只是不知道如何让它们工作。

感谢这里的任何帮助。 谢谢。

Answer 1

既然页面上已经有了 jQuery，为什么不使用它的 AJAX 功能呢？您的脚本文件会更容易阅读。

ma​​injs.js

function init_table() {
    requestInfo('showMain.php?mode=list&prev_cid=1','showTable','');
}

script.js

    function requestInfo(url,id,redirectPage) { 
    $.ajax({  type: "POST",
      url: url,
      data: id,
      success: function(msg){
      var temp = id.split('~');
      var r= msg.split("~")
      for (i=0;i<temp.length;i+=1){
         $(temp[i]).val(r[i]);
      }

      $(document).location.href = redirectPage;
   });

Answer 2

在此处找到了答案的提示。

尚未成功实现 nicedit，但 jquery 的 datepicker 已解决。

对于日期选择器我使用：

$(function(){
  $('.inputDate').live('click', function() {
    $(this).datepicker({
      starts: 1,
      position: 'right',
      onChange: function(formated, dates){
        $('#inputDate').val(formated);
        $('#inputDate').DatePickerHide();
      }
    });
  });
});