用于在 php 脚本中自动完成的 jquery 脚本在 <form> 标签内不起作用答案

【问题标题】：jquery script for autocomplete inside php script does not work inside <form> tags用于在 php 脚本中自动完成的 jquery 脚本在 <form> 标签内不起作用
【发布时间】：2012-12-14 23:27:52
【问题描述】：

我正在为 php 脚本中的输入文本框进行自动完成。这是javascript。一切正常... search.php 只是在 div 中填充了可供选择的选项。这是真正的问题。当我将输入文本框放在标签内时，显示自动完成选项的 div 无法在页面上呈现。我可以将 div 放在页面上的任何位置，只要页面上没有任何位置，它就可以工作。

<script type="text/javascript">
$(document).ready(function(){
$(".search").keyup(function()
{
var searchbox = $(this).val();
var dataString = 'searchword='+ searchbox;
if(clan_id=='')
{
}
else
{
$.ajax({
type: "POST",
url: "search.php",
data: dataString,
cache: false,
success: function(html)
{
$("#display").html(html).show();
}
});
}return false;
});
});
jQuery(function($){
$("clan_id").Watermark("Search");
});
</script>

search.php 正在返回此代码：

echo "<div class=\"display_box\" align=\"left\" onclick=\"document.getElementById  ('clan_id').value =' $final_clan_id '\">\n";
echo "<img src=\" $img \" style=\"width:25px; float:left; margin-right:6px\" />$final_clan_name  <br/></div>\n";

自动完成功能适用于此：

echo "<input type \"text\" id=\"clan_id\">\n";

自动完成功能失败：

echo "<form name ='showClan' method='post' action='" .  htmlentities($_SERVER['PHP_SELF']) . "'>\n";
echo "<input type \"text\" id=\"clan_id\">\n";
echo "</form>";

【问题讨论】：

等一下。我看到“自动完成功能适用于此”，但这是在哪里？！？ Search.php 被 Ajax 返回到另一个页面...但是该页面的内容在哪里？没有足够的上下文来提供帮助。

标签： php jquery html

【解决方案1】：

在审查和测试您的代码时，有几件事很突出：

1) 您的搜索字段没有您的 jQuery 函数正在寻找的“搜索”类。

2）并且您的 type 属性在您的两个示例中都缺少等号。

<input class="search" type="text" id="clan_id">

下面是一个工作示例，其中搜索字段和显示 div 包含在表单中：

http://jsfiddle.net/hansvedo/zhQse/

【讨论】：