Question

我有一个jquery ajax点击函数用于表单，当它发送时没有任何输入它发送到正确的php页面，但是当用户输入已经填写它发送到它发送的同一页面时，它也被发送作为帖子并改为获得

jquery的：

<script type="text/javascript">

$(document).ready(function() {

    $("#videoToUpload").click(function() {

var vidName = $("#vidName").val();
var videoDescription = $("#videoDescription").val();
var albumName1 = $("#choosevidCat").val();
var vidFile =$("#video").val();

  // Put an animated GIF image insight of content
  $("#loader").empty().html('<img src="/images/loader.gif" class="vidloader1"/>');

        $.post("includes/vid_upload.inc.php",{vidName: vidName, videoDescription: videoDescription, albumName1: albumName1,  vidFile: vidFile}, function(json)
         {

            if(json.result === "success") {

        $("#viduploadResult").html( "The Video "+vidName+" has been Uploaded!");


//        // First remove all the existing options
//       $('#choosevidCat').empty();
//
//        // Load the content:
//        $('#choosevidCat').load(location.href + "#choosevidCat > *");

    }else{
        $("#viduploadResult").html(json.message);
    }   

         });
    });
})
</script>

html（带有一些嵌入式php）：

 <div id="title">Upload Videos</div>
  <div class="vidUpload">
    <form id="vidUpload">
<input name="vidName" type="text" required="required" id="vidName" placeholder="Enter Video Name Here" title="Video Name">
<br>
<textarea name="videoDescription" id="videoDescription" required class="videoDescription" placeholder="Enter Video Description Here" title="Enter Video Description Here"></textarea>

<select name="select" required class="choosevidCat" id="choosevidCat">
<option value="">Choose the Catagory for your Video Here</option>
            <?php 
    $sql = ("SELECT albumId, albumName, albumSelect FROM albums");
if (mysqli_connect_errno()) {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$result = mysqli_query($mysqli, $sql);

while($row = mysqli_fetch_array($result)) {
$albumid = ($row['albumId']);
$album_name = ($row['albumName']);
$album_name1 = ($row['albumSelect']);
echo "<option value=".$album_name1. ">$album_name</option>";
}

?>


<option id="createCat" value="createCatagory">Create New Catagory Here</option>
</select>

<input type="file" name="video" id="video">
<input type="submit" name="videoToUpload" id="videoToUpload" value="Upload">

</form>
<div id="loader"></div>
<div id="viduploadResult"></div>

任何人都可以看到我做错了什么，我不知所措

Answer 1

将按钮更改为输入type =“button”以防止自动提交表单

Answer 2

您可以删除<form>代码，并将<input type="submit">更改为<input type="button">，这将停止尝试处理帖子的HTML表单。它作为GET发送的原因是因为它是表单的默认method（并且您没有指定方法）。

您的jQuery负责处理输入字段并发布数据，因此您不需要这样的表单。

jquery点击功能发送到引用页面而不是url＆page;页面

2 个答案: