在 Wordpress 中组合 jQuery 和 .php 时遇到问题答案

【问题标题】：Trouble combining jQuery and .php in Wordpress在 Wordpress 中组合 jQuery 和 .php 时遇到问题
【发布时间】：2015-11-09 10:32:54
【问题描述】：

我正在尝试在这里制作一个简单的翻译网站：http://traductordeinglesaespanol.co/。我创建了一个简单的 php 代码，它使用 get 到一个工作正常的外部翻译 api。代码如下：

<?php
if(!empty($_GET['text'])){
  $trans_url ='http://api.mymemory.translated.net/get?q='.urlencode($_GET['text']).'&langpair=en|es'    ;
  $trans_json = file_get_contents($trans_url); 
  $trans_array = json_decode($trans_json, true);    

  echo $trans_array['responseData']['translatedText'];
 }
?>

这是简单的html表单：

 <form id="form" method="get" action="tran.php">Enter Text to be Translated below:
 <input name="text" type="text" id="test" />
 <button id="but">Translate</button></form>

 <div class="results"></div>

现在翻译工作正常，但我想做的是使用 jQuery 获取 tran.php 结果并将其显示在表单下方的“结果”类中。我试图通过以下方式做到这一点：我通过编辑 functions.php 文件来加载它，因此它加载了 jQuery 和一个名为 tran.js 的 .js 脚本。当我检查元素时，我看到 jQuery 和正在加载的脚本。在脚本中，我放置了以下基本代码：

jQuery(document).ready(function(){

$('#go').click(function() {

    $.ajax({
         type: 'GET',
         url: 'tran.php',
         success: function(data) {
            $('.result').html(data);
            }
    });
 });
});

并将操作更改为处理此页面中的表单。（tran.php 在根目录中。）但它根本不起作用。我怀疑编码中存在一些关键错误，但作为一个完整的初学者，我找不到错误在哪里，所以任何建议/更正将不胜感激！

【问题讨论】：

当你做AJAX时，你不提交表单......所以你只是在没有参数的情况下调用tran.php......你必须在你的get参数中添加要翻译的文本，或在 POST 中...您是否在 tran.php 的开头添加了日志以查看是否达到？当您检查 if(!empty($_GET['text'])) 时，您期待 GET 元素...
非常感谢您的回复。我明白了你的意思，但不知道如何实施。假设我使用 jQuery 将用户的输入存储在“tobetranslated”变量中。那么我应该如何修改 AJAX 调用和 tran.php ？

标签： javascript php jquery wordpress get

【解决方案1】：

我设法让它工作了！有一个小错字：

     data : 'text=' + to_be_translated;

我替换了“;”最后用逗号结尾，现在我得到这样的结果：假设我输入了要翻译的文本名称（西班牙语中的 nobre！），我得到了：

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"/> <title>estes</title> </head> nombre

所以我必须以某种方式摆脱这些标题！无论如何，我想再次非常感谢您的帮助！谢谢！

【讨论】：

【解决方案2】：

你应该这样使用 ajax：

var to_be_translated = "Hello";
$.ajax({
    type: 'GET',
    url: 'tran.php',
    data : 'text=' + to_be_translated,
    success: function(data) {
        $('.result').html(data);
    }
});

这里我添加了“数据”标签，它表示JS变量to_be_translated在PHP中将被视为$_GET['text']。

【讨论】：

非常感谢您的随机回复！你为我指明了正确的方向。不幸的是，某处一定有错误。我已经设法使脚本将输入存储在“to_be_translated”pastebin.com/CfVaPn8d 中，但是当我按照您的建议进行 ajax 调用时，它什么也不做。
@user5541918 是的，我打错字了，你需要在每行末尾添加一个逗号，而不是分号