Question

当我提交表单时，ajax总是重定向到some.php，如何在提交表单后阻止它重定向到PHP脚本我希望页面重定向到index.html

<html>
<head>
<meta charset="utf-8">
<title>jQuery Adapter &mdash; CKEditor Sample</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script src="../ckeditor.js"></script>
<script src="../adapters/jquery.js"></script>
<script src="jquery.form.js"></script>

<script>
    CKEDITOR.disableAutoInline = true;

    $( document ).ready( function() {
        $( '#editor1' ).ckeditor(); // Use CKEDITOR.replace() if element is <textarea>.
        $( '#editable' ).ckeditor(); // Use CKEDITOR.inline().
    } );

    function setValue() {
        $( '#editor1' ).val( $( 'input#val' ).val() );
    }
</script>
</head>

<body>
<form id="f1" action="some.php" method="post" enctype="multipart/form-data">
<table>
    <tr>
        <td>Title:</td>
        <td><input type="text" name="articletitle" id="articletitle" required/></td>
    </tr>
    <tr>
        <td>Featured Image:</td>
        <td><input name="MAX_FILE_SIZE" value="2097152" type="hidden">
        <input name="image" id="image" type="file" required/></td>
    </tr>
    <tr>
        <td colspan="3"><textarea cols="80" id="editor1" name="editor1" rows="10"></textarea></td>
    </tr>
    <tr>
        <td><input id="save" type="submit" value="Save"></td>
    </tr>
</table>
</form>

<script type="text/javascript">

$(document).ready(function(){
    $("#save").click(function(){
        $("#f1").ajaxForm();
    });
});
</script>
</body>
</html>

请帮助我这个人。

Answer 1

试试这个：

$(document).ready(function(){
    $("#save").click(function(e){
        e.preventDefault();
        $("#f1").ajaxForm();
    });
});

它应该阻止您的输入执行重定向页面的默认行为。

编辑：

要重定向到另一个页面，您应该使用以下内容：

window.location.href = 'http://www.google.com';

关于ajax的成功活动。

编辑2：

试试这个小提琴：http://jsfiddle.net/4hF6e/3/确保你的引用是正确的。在我看来，AjaxForm插件有一些方法来防止按钮上的默认行为。

Answer 2

<input type="submit">的默认行为是提交表单。

有两种方法可以解决这个问题。第一个是简单地使input成为button。这将阻止浏览器发送表单。

更好的方法是独立于JavaScript并使用@Jeemusu所说的内容，使用preventDefault()来阻止提交。

Answer 3

TRY

$("#save").click(function(e){
        e.preventDefault();
        $("#f1").ajaxForm();

});

OR

$("#save").click(function(){
        $("#f1").ajaxForm();
        return false;
});

Answer 4

而不是使用type="submit"，您可以使用：

type="button"

或者您可以使用.preventDefault();：

$("#save").click(function(e){
    e.preventDefault();
    $("#f1").ajaxForm();

});

Answer 5

或者您可以附加到表单的“onsubmit”事件。并在该函数中返回false。即：

$('#f1').submit(function() {
  // do your ajax stuff... and when completed (success) redirect 
  // using document.location.href = 'index.html';
  return false;
});

我的ajaxForm重定向到PHP脚本

5 个答案: