Question

我正在制作一个投票系统。用户单击这些按钮（div）后，将调用ajax将数据传递到另一个页面，执行SQL以插入会话ID，投票值，投票ID并显示新的总数
这是我的ajax

$('.like').on('click', function(){
    var voteclass=2;
    var vote_id=$(this).parent().attr("id");
    var poststr="voteclass="+voteclass+"&voteteacher="+vote_teacher;
    $.ajax({
    url:"insert.php",
    cache:0,
    data:poststr,
    success:function(result){
    $('#'vote_id).html(result);}  });   });

在ajax之后， insert.php 执行SQL并显示与fontpage相同的投票div内容但具有新总值的结果。
我的问题是我不能再投票没有刷新整个页面。是否意味着innerHTML无法在外部的head元素（我不知道是什么术语）页面中加载脚本？我该如何解决呢？

Answer 1

您需要使用on()功能，更改：

$('.like').bind('click', function(){

到

$('body').on('click','.like', function(){

当然，我认为你向我们展示的脚本片段包含在：

$(document).ready(function(){
   ...
});

同样改变这个：

var vote_id=$(this).parent().attr("class");

为：

var vote_id=$(this).parent().attr("id");

Answer 2

我想我只想添加一个答案：Working Fiddle

使用Javascript：

我将整个逻辑包装在document.ready中以确保DOM已完全加载，我假设您也在这样做。

我也使用了＆＃39;＆＃39;而不是＆＃39; bind＆＃39;因为这是jQuery首选方法及其当前库。

我的ajax调用是对jsFiddle的模拟ajax调用，但你可以用index.php替换url。

在成功的过程中，我使用了$（＆＃39;。＆＃39; + vote_id），因为你得到的是＆＃39; class＆＃39;父母的，所以你需要一个＆＃39;。＆＃39;而不是＃＆＃39;＃＆＃39;在jquery选择器中。如果我是你，我会更改变量＆＃39; vote_id＆＃39;被称为“父母投资课程”＃。

最后，我使用了＆＃39;追加＆＃39;因为您不想丢失父标记中的现有html。这会将结果中的值添加到父元素中现有html的末尾。如果你使用prepend（结果），它将把它放在第一位，使用.html（result）将替换它。

 $(document).ready(function() {
        $('.like').on('click', function(){
            var vote_teacher = 1;
        var voteclass = 2;
        var vote_id = $(this).parent().attr("class");
        var poststr="voteclass="+voteclass+"&voteteacher="+vote_teacher;
        $.ajax({
            type: "POST",
            url: "/echo/json/",
            data: poststr,
            cache: false,
            success: function(result) {
                var someDatafromResult = "my stuff";
                $('.'+vote_id).append(someDatafromResult);
            }
        });
    });
});

HTML：

<div id="parent" class="parentClass">
<a href="#" class="like">Vote!</a>    
</div>

更新：

我修改了你的小提琴：Modified Fiddle

主要的变化是：

function main(){
$('#something').on('click','.agree', function(){...code hidden...}

这允许您在父元素上绑定事件，而不是##;＃something＆＃39;你也可以使用文件。现在，如果你使用＆＃39;同意＆＃39;阶级被取代或被吹灭，甚至依然存在。

我伪造了成功的php返回：

success:function(result){            
           $('#'+des_id+'').html('<li>text    <span class="votes_type ">    <a href="#!" class="agree">'+voteNumber+'<img src="png"></a>    <a href="#!" class="disagree">disagreenumber<img src="png"></a> </span>    </li>   ');
           ;}

我使用了一些内联stringed html伪造html返回结果，然后使用变量＆＃39; voteNumber＆＃39;每次点击都会增加，以表明它确实会改变并继续工作。

Answer 3

尝试这个..

 $('.like').on('click', function(){
        var voteclass=2;
        var vote_id=$(this).parent().attr("class");
        var poststr="voteclass="+voteclass+"&voteteacher="+vote_teacher;
        $.ajax({
            url:"insert.php",
            cache:0,
            data:poststr,
            success:function(result){
                $('#vote_id').html(result);
            }
        });  
 });

如何在AJAX之后使用innerHTML中的javascript工作

3 个答案: