0

我显然在这里做错了什么,但我无法弄清楚为什么 Ajax 没有触发而是坚持页面加载。newBatable() 触发良好,我似乎无法获得尊重 ajax 调用的投票。

HTML - 不知道如何将 html 作为代码放在这里:/ - 我觉得很愚蠢。

<form class="form-horizontal" id="batable1" action="vote.php" method="GET">
    <div id="success-vote-1"></div>
    <input type="radio" name="batableResult" value=" include ()" /> include ()<br/>
    <input type="radio" name="batableResult" value="require ()" />require ()<br/>
    <input type="radio" name="batableResult" value="both of above" />both of above<br/>
    <input type="radio" name="batableResult" value="None of above" />None of above<br/>
    <button class="btn btn-primary" onClick="vote(1)">Vote</button>
    <input type="hidden" name="batableId" id="batable-id" value="1"/>
</form>

JS - 控制台显示我想要的一切,php 脚本可以很好地处理一切并完美运行,只是它必须在浏览器中加载 php,所以它不使用 AJAX

/***************************************/
function newBatable() {
var batableData = $('#new-batable').serialize();
//console.log(batableData);
    $.ajax({
        url: "process.php",
        data: batableData,
        success: function(data){
            $('#success-new-batable').html(data);
        }
    });
}

/***************************************/
function vote(poll_id) {
//console.log(poll_id)
var batableId = "#batable" + poll_id;
//console.log(batableId)
var pollData = $(batableId).serialize();
//console.log(pollData);
    $.ajax({
        url: "vote.php",
        data: pollData,
        success: function(data){
            var batable_success_id = "#success-vote" + poll_id;
            $(batable_success_id).html(data);
        }
    });
}
4

3 回答 3

3

提交按钮触发 JavaScript,然后立即提交表单。

如果您正在使用onclick,则return false停止。

不过,您最好使用更现代的事件绑定技术

于 2013-05-30T16:08:43.400 回答
2

如何通过 jquery 将单击事件附加到按钮?

$(".btn").on('click', function(e){
    e.stopPropagation()
    e.preventDefault();
    vote(1);
});

这通常会放在外部文件中的文档 .ready jquery 中或脚本标签内页面底部附近的某个地方。

这有帮助吗?

于 2013-05-30T16:12:34.070 回答
1

由于您已经在使用 jQuery,作为 SubstanceD,您应该使用 jQuery 的 on() 方法并停止事件传播并阻止默认操作(提交表单)。

我还注意到您的代码中可能存在错误。好像有错别字。你有

var batable_success_id = "#success-vote" + poll_id;

<div id="success-vote-1"></div>。例如,当您连接到时,您vote的ID后面会有一个破折号。因此,即使进行了 AJAX 调用,它也可能不会像您期望的那样更新您的 HTML。divbatable_success_id#success-vote1

于 2013-05-30T16:24:28.773 回答