将Javascript附加到某些表单字段自动完成

时间:2014-03-12 07:49:55

标签: jquery jquery-ui

我有一个很好的自动完成脚本但是我将它添加到具有多个表格的页面中,现在它无法正常工作。

这是JS:

<script type="text/javascript" src="jquery/js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="jquery/js/jquery-ui-1.8.2.custom.min.js"></script> 
<script type="text/javascript"> 

    jQuery(document).ready(function(){
        $('#zipsearch').autocomplete({source:'suggest_zip.php', minLength:2});
    });

</script> 
<link rel="stylesheet" href="jquery/css/smoothness/jquery-ui-1.8.2.custom.css" /> 
<style type="text/css"><!--

        /* style the auto-complete response */
        li.ui-menu-item { font-size:12px !important; }

--></style> 

表格With Field是:

<form action="<?php echo $GLOBALS["webroot"]; ?>/index.php?action=<?php echo $GLOBALS["RFA"];?>" method="post" name="postForm1">

<input name="LocationID" type="text" class="span10" id="zipsearch">

我试过了:

jQuery(document).postForm1.ready(function(){
    $('#zipsearch').postForm1.autocomplete({source:'suggest_zip.php', minLength:2});
});

这是与我正在处理的页面位于同一文件夹中的TEST表单...所有内容都适用于此测试页

<html> 
<head> 
    <title>test jquery autocomplete</title> 
    <script type="text/javascript" src="jquery/js/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="jquery/js/jquery-ui-1.8.2.custom.min.js"></script> 
    <script type="text/javascript"> 

        jQuery(document).ready(function(){
            $('#zipsearch').autocomplete({source:'suggest_zip.php', minLength:2});
        });

    </script> 
    <link rel="stylesheet" href="jquery/css/smoothness/jquery-ui-1.8.2.custom.css" /> 
    <style type="text/css"><!--

            /* style the auto-complete response */
            li.ui-menu-item { font-size:12px !important; }

    --></style> 
</head> 

<body> 

<form onsubmit="return false;"> 
    Enter a City:
    <input id="zipsearch" type="text" /> 
</form> 

</body> 
</html>

3 个答案:

答案 0 :(得分:1)

PostForm1写错了, 你的表单名为postForm1,带有一个小p; - )

对于一个ID,使用它就像这样,它不会影响你的身份是什么形式:

$(document).ready(function()
        {
        $("#zipsearch").autocomplete({source:'suggest_zip.php',minLength:2});
        });

答案 1 :(得分:1)

将类添加到您想要自动完成的所有字段:

<input name="LocationID" type="text" class="span10 autocomplete" id="zipsearch">
<input type="text" class="span10 autocomplete">
<input type="text" class="span10 autocomplete">

然后,更改您的选择器:

$(function() {
    $('.autocomplete').autocomplete({source:'suggest_zip.php', minLength:2});
});

答案 2 :(得分:1)

抱歉,这是我...我没有把文件放在主目录中...我的index.php控制文件所在的位置

感谢所有帮助

相关问题