jQuery

使用jQuery

收到WordPress网页后，您的jQuery脚本会在用户浏览器上运行。 一个基本的jQuery语句有两个部分：一个选择器，用于确定代码适用于哪些HTML元素，以及一个动作或事件，用于确定代码的作用或反应。 基本事件语句如下所示：

jQuery.(selector).event(function);

当由选择器选择的HTML元素中发生诸如鼠标点击的事件时，将执行在最后一组括号内定义的函数。

所有以下代码示例均基于此HTML页面内容。 假设它出现在插件的管理设置屏幕上，由myplugin_settings.php文件定义。 它是一个简单的表，每个标题旁边都有单选按钮。

<pre>
<form id="radioform">
 <table>
  <tbody>
   <tr>
    <td><input class="pref" checked="checked" name="book" type="radio" value="Sycamore Row" />Sycamore Row</td>
    <td>John Grisham</td>
   </tr>
   <tr>
    <td><input class="pref" name="book" type="radio" value="Dark Witch" />Dark Witch</td>
    <td>Nora Roberts</td>
   </tr>
  </tbody>
 </table>
</form>
</pre>

输出可能在您的设置页面看起来像这样。

样品表

在关于AJAX的文章中，我们将构建一个AJAX交换器，用于在usermeta中保存用户选择，并添加标有选定标题的帖子数量。 不是一个非常实用的应用程序，但它说明了所有重要的步骤。 jQuery代码可以驻留在外部文件中，也可以输出到<script>块内的页面。 我们将专注于外部文件变体，因为PHP的传递值需要特别注意。 如果您似乎更方便，则可以将相同的代码输出到页面。

选择器和事件

选择器与CSS选择器的形式相同：“.class”或“#id”。 有更多的形式，但这些是您将经常使用的两个。 在我们的示例中，我们将使用类“.pref”。 还有一大堆可能的事件，一个你可能会使用很多是'点击'。 在我们的例子中，我们将使用'change'来捕获单选按钮。 请注意，jQuery事件通常被命名为与JavaScript不同的命名。 到目前为止，在添加了一个空的匿名函数之后，我们的示例语句如下所示：

$.(".pref").change(function(){
    /*do stuff*/
});

当“pref”类的任何元素发生变化时，此代码将“做任何事情”。

注意：此代码片段以及此页面上的所有示例都用于说明AJAX的使用。 代码不适合于生产环境，因为有意的省略了相关的操作，如清洁，安全，错误处理和国际化。 一定要在生产代码中解决这些重要的操作。