Question

我有一个插件，其中包含一个从DB插入/获取数据的函数。我的问题是如何使用jquery或链接wordpress插件中的任何其他JS。我搜索并找到了很多文章，但目前尚不清楚，请在我的插件中添加jquery文件。我尝试过的步骤在页面顶部添加此行。

这是我的插件代码

<?php
/*
Plugin Name: myplugin
Description: form
Version: 4.0
Author: hercal
License: GPL
*/
?>
<?php 
function  form_creation()
{
global $wpdb;
function my_scripts_method()
{
wp_enqueue_script('fn',plugins_url('/myplugin/fn.js' , __FILE__ ),
    array( 'jquery' )
  );
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
?>
<form action=" <?php get_permalink(); ?> " method="post" id="myform">
<table>


<tr>
<td><input type="text" id="txtname" name="txtname" placeholder="Your Name"/> </td>
</tr>


<tr>
<td>
<!-- drop down menu  (Country )-->
<select id='select_Country' name="select_Country" >
        <option selected="selected" disabled="disabled"> -- Select Country -- </option>
        <?php
        $query='select Code,Country from _country order by Country';
        $result = $wpdb->get_results($query);
        foreach( $result as $row ) 
        {
           echo '<option value='.$row->Code.'>'.$row->Country.'</option>';
        }
        ?>
</select> 

</td>
</tr>


<tr>
<td>
<!-- drop down menu  (City )-->
<select id="select_city" name="select_city">
    <option selected="selected"> -- Select City -- </option>
</select>
</td>
</tr>


<tr>
<td> <input type="submit" id="btnsubmit" value="Submit" name='submit'/> </td>
</tr>

</table>
</form>
<?php } ?>
<?php
if($_POST['submit'])
{
    $name=strip_tags($_POST['txtname']);
    $country=$_POST['select_Country'];
    $city=$_POST['select_city'];
    $insertQuery="insert into _customers(Name,Country,City)values('$name','$country','$city')";
    $wpdb->query($insertQuery);
}
?>
<?php add_shortcode('test',form_creation); ?>

及以下是fn.js，位于C：\ wamp \ www \ test \ wp-content \ plugins \ myplugin \ fn.js

<script type="text/javascript">
$(document).ready(function(){
    <!-- ajax method to bind the dropdown menu of model-->
        $("#select_brand").change(function(){
        var id=$(this).val();
        var dataString = 'id='+ id;
        $.ajax({
        type: "POST",
        url: "model.php",
        data: dataString,
        cache: false,
        success: function(data)
        {
            $("#select_Model").html(data);
        } 
        });
        });

    <!-- ajax method to bind the dropdown menu of city-->   
        $("#select_Country").change(function(){
        var id=$(this).val();
        var dataString = 'id='+ id;
        $.ajax({
        type: "POST",
        url: "city.php",
        data: dataString,
        cache: false,
        success: function(data)
        {
            alert("yes");
            $("#select_city").html(data);
        } 
        });
        });
        });
</script>

最后是city.php的代码

<?php
    if($_POST['id'])
    {
        global $wpdb;
        $id=$_POST['id'];
        $query="select id,CountryCode,City from _city where CountryCode='$id'";
        $result=$wpdb->get_results($query);
        echo '<option selected="selected" disabled="disabled"> -- Select City -- </option>';
        foreach ($result as $row)
        {
            $id=$row->id;
            $city=$row->city;
            echo '<option value="'.$id.'">'.$city.'</option>';
        }
    }
?>

问题是城市下拉不能获得价值。

Answer 1

你明显在wordpress实现中的其他地方包含了另一个自定义脚本/ js文件，但它没有依赖于jQuery，因此它在jQuery加载之前运行。因此，请确保包含jQuery代码的自定义脚本依赖于它。

见下文（记下函数中的array('jquery')）：

<?php

function my_scripts_method() {
    wp_enqueue_script(
        'custom-script',
        get_stylesheet_directory_uri() . '/js/custom_script.js',
        array( 'jquery' )
    );
}

add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

?>

来源：Function Reference/wp enqueue script - Link a Theme Script Which Depends on jQuery

Answer 2

使用

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

要在插件文件中排队脚本

实施例

function my_scripts_method() {
wp_enqueue_script(
    'jsscript',
    plugins_url( '/js/jsscript.js' , __FILE__ ),
    array( 'jquery' )
  );
}

add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

link- http://codex.wordpress.org/Function_Reference/wp_enqueue_script

在wordpress插件中使用Jquery

2 个答案: