调用 jQuery ajax 函数答案

【问题标题】：calling jQuery ajax functions调用 jQuery ajax 函数
【发布时间】：2015-08-31 15:46:12
【问题描述】：

请多多包涵；这几天我一直在和这个作斗争。

我的 jQuery(document).ready 函数中有一些 jQuery 代码，如下所示：

        jQuery(document).ready(function($) {
        jQuery.post(ajaxurl, data, function(response) {
          alert(response);
        });
    });

我有一个文本输入字段，我想将它发送到我的 Ajax 函数（使用 Wordpress API）

    <input type="text" name="input" id=input onkeydown="if (event.keyCode == 13) {send_message(this.value);}">

如果用户按下按键，文本将发送到 javascript 的“send_message”函数（如下）。

function send_message(value){
  data[txt]=value;
  jQuery.post(ajaxurl, data, function(response) {
    alert(response);
  });
}

基本上，我已向我的数据对象添加了一个“txt”键/值对，现在我希望将其提交给我的 ajax 函数。

“文档就绪”部分工作正常，但我无法让它接受更改的数据对象。

您可能会说，我没有很好地遵循 jQuery 代码背后的逻辑。

【问题讨论】：

我认为你的数据对象声明是错误的，你应该尝试类似的东西：var data = {txt: value};
是的，对不起，我应该提到数据对象已初始化： var data = { action: 'chat_comms', nonce: '1f656a482b', id: 5 };它是在根命名空间中初始化的.
txt 有值吗？还是你想data["txt"]=value？
txt 被初始化为空。我正在尝试使用用户填写的文本输入的内容来设置它，以便我可以将文本输入值传递给 php 函数。
this.value 为空的一个可能原因是在触发onkeydown 时它尚未设置。见stackoverflow.com/a/1338497/3305116

标签： jquery ajax wordpress

【解决方案1】：

function send_message(value){

    if(!value){
        alert('value is empty');
    } 

    if(!data){
        alert('data is empty');
    }

    data.txt=value;

    jQuery.post(ajaxurl, data, function(response) {
       alert(response);
    });
}

如果你检查你的控制台，你可能会得到 txt is not defined 你错过了他们周围的 ''。如果您相信良好的做法，通常将 .dot 表示法用于已知对象键并保存 [] 用于动态键。

另外你还没有提到你正在使用什么浏览器...我不能发誓这是最新的，但 Firefox 使用 event.which 而不是 keycode...所以：

 onkeydown="var code= event.which || event.keyCode; if (code == 13) {send_message(this.value);}"

编辑

此实例的解决方案。

您在钩子“enqueue_scripts”上将 js 文件排入队列，它应该是“admin_enqueue_scripts”并且还指定它需要 jQuery。

add_action( 'admin_enqueue_scripts', 'load_chat_me_styles' ); //-->note changed hook!

我还更新了 js 文件以允许控制台日志和 php 文件以提供更好的反馈。

Jsfile - 另存为新文件名以排除缓存 http://pastebin.com/NyqGqhG0

Phpfile - 记下任何注释... http://pastebin.com/N7LQg0Zi

【讨论】：

我已复制并粘贴到您的代码中，尽管已分配了值，但 data.txt 实体仍然是空字符串。数据似乎保留了根命名空间中定义的值，并且在函数中更改它们似乎不起作用。
正如我所提到的，我对逻辑有点困惑：如果我删除代码的 jQuery(document).ready(function($) 部分（其中，大概是在文档加载完成时触发）不再发送 ajax 帖子。就好像我的 send_message 函数中的 ajax.post 被忽略了一样。
PS，是的，我正在 Firefox 上测试。
我已经修改了脚本：<script> var message=''; jQuery(document).ready( function($) { alert('Alert 1:'+message);//alert 1 data={action: 'chat_comms', nonce: snonce, id: userid, txt: message}; jQuery.post( ajaxurl, data, function(response) { alert(response); } ); } ); function send_message(value){ alert('Alert 2:'+value);// alert 2 message=value; } </script>
我希望当 send_message 运行时 message 变量设置为“值”。 jQuery(document).ready 函数似乎在 send_message 之后被调用（我不知道为什么，但无论如何），但是根据警报，message 变量是空白的1，即使警报 2 显示它有一个值。

【解决方案2】：

您的函数中的数据参数未初始化。如果您使用 chrome 或 firefox 检查您的页面，您可能会看到一个 javascript 错误。

jquery 的 post 函数中的 data 参数基本上接受序列化的表单查询字符串或 JSON 字符串/对象。

另外，请查看api：http://api.jquery.com/jquery.post/

试试下面的修改代码：

function send_message(value){
    var data={txt:value};
      jQuery.post(ajaxurl, data, function(response) {
        alert(response);
      });
    }

【讨论】：

在根命名空间初始化。