Question

我花了一段时间在互联网上搜索我似乎是一个简单的解决方案。我将向您展示我一直在查看的代码和ajax模板。

<form style="padding:10px 2px;" name="test" class="searchform" action="#" method="GET">
<input style="margin-top:22.5px;" name="input_value" type="text" class="searchbx" size="" placeholder="Search songs..." />
<select name="cbb">
<?php
echo "<option value='artist'>$Artist</option>";
echo "<option value='name'>$Title</option>";
?>
</select>
<input id="sa" style="position:absolute;margin-top:35px;width:90px;" name="submit" type="submit" class="searchbutton" value="OK" />
</form>
<div id="sidebar-query-results">
         <ul id="current-list" style="list-style: none; padding: 0;">
<?php
if (isset($_GET['submit']))
{
// Execute this code if the submit button is pressed.
if (empty($_GET['input_value'])) {
die();
}
include "db_config.php";

$input_value = $_GET['input_value'];
$combo_box_value = $_GET['cbb'];
echo $formvalue;
echo $cbbvalue;
$query =  "SELECT * FROM `links` WHERE `$combo_box_value` LIKE '%$input_value%' LIMIT 0, 20" ;   
$result = mysql_query($query);
if($result) {
while($row = mysql_fetch_assoc($result)){
$cover = $row['cover'];
$title = $row['title'];
$name = $row['name'];
$artist= $row['artist'];
$url = $row['url'];

脚本的其余部分只是打印结果等。

脚本本身就像魅力一样，虽然我知道它非常“邋”“但是，功能性是我现在真正关心的所有内容。

无论如何这里是ajax模板：

 <script>
 $('form[name="test"]').submit(function(e) {
 e.preventDefault();

 $.ajax({
 url : #.action,
 type : this.method,
 data : $(this).serialize(),
 success : function(response) {

 }
 });
 });
 </script>

无论哪种方式，只是ajax脚本，我无法工作的PHP脚本我真的不想改变，我看了几十个教程但是，我在实现它们时遇到了很多麻烦我的情况。

Answer 1

那是因为脚本实际上导致语法错误，因此您的AJAX绑定没有按预期发生（整个<script>被拒绝，因此它没有绑定到submit事件而且从不调用{{1 }） - 主要是因为以下原因：

.preventDefault()

尝试将其更改为：

url : #.action,

（如果您想引用url : $(this).prop('action')属性），否则请使用<form action="...">

之类的字符串

更通用的脚本类似于：

url: '/submit.php',

然后你可以将$('form.ajax').on('submit',function(e){ var $form = $(this); $.ajax({ 'type': $form.prop('method'), 'url': $form.prop('action') || document.location, 'data': $form.serialize(), 'success': function(response){ // handle response } }); e.preventDefault(); });类添加到任何你希望用ajax增强的表格中（当然那些没有javascript支持的表格会默认回到“传统”方法）。

提交此表单后似乎无法阻止页面刷新

1 个答案: