Question

我正在我的WordPress网站上制作一个自动建议输入框。它完全适用于一个输入框，但不适用于同一页面上的第二个框。这是我的代码。在儿童主题的function.php中。

IE.Quit
End Sub

你可以看到我已经为我的jquery使用了mysite.js文件。该文件的代码是..

    function mysite_js() {
    wp_enqueue_script('autocomplete', get_stylesheet_directory_uri().'/js/jquery.auto-complete.js', array('jquery'));

    wp_enqueue_script('mysite-js', get_stylesheet_directory_uri().'/js/mysite.js', array('jquery', 'autocomplete'));

    wp_enqueue_style('autocomplete.css', get_stylesheet_directory_uri().'/js/jquery.auto-complete.css');

}
add_action('wp_enqueue_scripts', 'mysite_js');



add_action('wp_ajax_nopriv_get_listing_names', 'ajax_listings');
add_action('wp_ajax_get_listing_names', 'ajax_listings');

function ajax_listings() {
    global $wpdb;


    $name = $wpdb->esc_like(stripslashes($_POST['name'])).'%'; //escape for use in LIKE statement
    $sql = "select post_title 
        from $wpdb->posts 
        where post_title like %s 
        and post_type='portfolio' and post_status='publish'";

    $sql = $wpdb->prepare($sql, $name);

    $results = $wpdb->get_results($sql);

    //copy the business titles to a simple array
    $titles = array();
    foreach( $results as $r )
        $titles[] = addslashes($r->post_title);

    echo json_encode($titles); 

    die(); 
}

和输入框的HTML是

jQuery(document).ready(function($) {    

    $('#ews-search').autoComplete({
        source: function(name, response) {
            $.ajax({
                type: 'POST',
                dataType: 'json',
                url: '/wp-admin/admin-ajax.php',
                data: 'action=get_listing_names&name='+name,
                success: function(data) {
                    response(data);
                }
            });
        }
    });

});

jQuery(document).ready(function($) {    

    $('#ews-search1').autoComplete({
        source: function(name, response) {
            $.ajax({
                type: 'POST',
                dataType: 'json',
                url: '/wp-admin/admin-ajax.php',
                data: 'action=get_listing_names&name='+name,
                success: function(data) {
                    response(data);
                }
            });
        }
    });

});

jQuery(document).ready(function($) {
  $('#content .ews-search-class').attr('id','ews-search1');
});

现在我实际上要做的是，我使用jQuery更改了第二个输入框的ID，因为输入框都来自相同ID的相同短代码所以我使用jQuery更改了第二个框的ID 。这是我工作的页面的link。请帮忙。

Answer 1

它只是在mysite.js的一个小改动后才起作用

jQuery(document).ready(function($) {   

    $('#ews-search').autoComplete({
        source: function(name, response) {
            $.ajax({
                type: 'POST',
                dataType: 'json',
                url: '/wp-admin/admin-ajax.php',
                data: 'action=get_listing_names&name='+name,
                success: function(data) {
                    response(data);
                }
            });
        }
    });

});


jQuery(document).ready(function($) {
  $('#content .ews-search-class').attr('id','ews-search1');
});

jQuery(document).ready(function($) {   

    $('#ews-search1').autoComplete({
        source: function(name, response) {
            $.ajax({
                type: 'POST',
                dataType: 'json',
                url: '/wp-admin/admin-ajax.php',
                data: 'action=get_listing_names&name='+name,
                success: function(data) {
                    response(data);
                }
            });
        }
    });

});

输入框中的自动建议在WordPress中的同一页面上的第二个输入框中不起作用

1 个答案: