Fatal编程技术网
  • javascript/
  • Javascript 用于具有动态值的函数的变量不'；我不允许通过ajax发送表单

Javascript 用于具有动态值的函数的变量不'；我不允许通过ajax发送表单

javascript jquery ajax

Javascript 用于具有动态值的函数的变量不'；我不允许通过ajax发送表单,javascript,jquery,ajax,preventdefault,Javascript,Jquery,Ajax,Preventdefault,我在一页上有许多答案表格，所有表格都有不同的类别 所有表单都有两个按钮来发送父表单 如果单击了#avote_down或#avote_up，则发送表单，然后单击按钮获得父表单类，并将该类保存在var类别中，然后添加。在类名之前（我知道dot很奇怪，但如果我不这么做，这就不起作用了），在这之后，我将之前编辑的类保存在名为answervows的var上，这样我们就可以使用它了 //declare variables outside the functions to use them //inside

我在一页上有许多答案表格，所有表格都有不同的类别

所有表单都有两个按钮来发送父表单

如果单击了
#avote_down
或
#avote_up
，则发送表单，然后单击按钮获得父表单类，并将该类保存在var
类别中，然后添加。在类名之前（我知道dot很奇怪，但如果我不这么做，这就不起作用了），在这之后，我将之前编辑的类保存在名为
answervows
的var上，这样我们就可以使用它了


//declare variables outside the functions to use them
//inside others
var answerdata;
var answervotes;
var clase;
var clasedot;

$('#avote_down, #avote_up').on("click",function(e) {
    e.preventDefault();
    clase = $(this).parents("form:first").attr('class');
    clasedot = '.'+clase; 
    answervotes = $(clasedot);
    answerdata = answervotes.serializeArray();
    answerdata.push({name: encodeURI($(this).attr('name')), value: encodeURI($(this).attr('value'))});
    answervotes.submit();
    answerdata.pop();
});


如果一切顺利，我可以使用下面的ajax函数发送表单，正如您看到的，ajax函数正在使用前面声明的vars


answervotes.bind('submit',function () {
    $.ajax({
        url: answervotes.attr('action'),
        type: answervotes.attr('method'),
        cache: false,
        dataType: 'json',
        data: answerdata,
        success: function(data) {
            if(data.message == "plus")
            {
                $("#avote_up").attr('class','options options-hover');
                $("#avote_down").attr('class','options');
                $("#atotal-votes").html(data.votes);
                console.log(data.votes);

            }
            if(data.message == "sub")
            {
                $("#avote_down").attr('class','options options-hover');
                $("#avote_up").attr('class','options');
                $("#atotal-votes").html(data.votes);
                console.log(data.votes);

            }
            if(data.name == "register")
            {
                $('.theme-actions').append('<div class="should-login"><span>' + data.message + '</span><div id="close"></div></div>');

                setTimeout(function() {
                    $('.should-login').fadeOut(300);
                },4000);

                setTimeout(function() {
                    $('.should-login').remove();
                },4300);
            }
            if(data.name == "limited_votes")
            {
                $('.theme-actions').append('<div class="should-login">    <span>' + data.message + '</span><div id="close"></div></div>');

                setTimeout(function() {
                    $('.should-login').fadeOut(300);
                },4000);

                setTimeout(function() {
                    $('.should-login').remove();
                },4300);
            }
            if(data.name == "repeated_vote")
            {
                $('.theme-actions').append('<div class="should-login"><span>' + data.message + '</span><div id="close"></div></div>');

                setTimeout(function() {
                    $('.should-login').fadeOut(300);
                },4000);

                setTimeout(function() {
                    $('.should-login').remove();
                },4300);
            }
        },
        error: function(xhr, textStatus, thrownError) {
            console.log(data.message);
            alert("error");
        }
    });
return false;
});



answervows.bind（'submit'，函数（）{
$.ajax({
url:answervows.attr（'action'），
类型：answervows.attr（'method'），
cache:false，
数据类型：“json”，
数据：回答数据，
成功：功能（数据）{
如果（data.message==“加”）
{
$（“#avote_up”）.attr（'class'，'options hover'）；
美元（“#avote_down”）.attr（'class'，'options'）；
$（“#原子投票”）.html（data.vows）；
console.log（数据.投票）；
}
如果（data.message==“sub”）
{
$（“#avote_down”）.attr（'class'，'options hover'）；
$（“#avote_up”）.attr（'class'，'options'）；
$（“#原子投票”）.html（data.vows）；
console.log（数据.投票）；
}
如果（data.name==“寄存器”）
{
$（'.theme actions'）.append（''+data.message+''）；
setTimeout（函数（）{
$（'.should login'）.fadeOut（300）；
},4000);
setTimeout（函数（）{
$（'.should login'）.remove（）；
},4300);
}
如果（data.name==“有限投票”）
{
$（'.theme actions'）.append（''+data.message+''）；
setTimeout（函数（）{
$（'.should login'）.fadeOut（300）；
},4000);
setTimeout（函数（）{
$（'.should login'）.remove（）；
},4300);
}
如果（data.name==“重复投票”）
{
$（'.theme actions'）.append（''+data.message+''）；
setTimeout（函数（）{
$（'.should login'）.fadeOut（300）；
},4000);
setTimeout（函数（）{
$（'.should login'）.remove（）；
},4300);
}
},
错误：函数（xhr、textStatus、thrownError）{
console.log（data.message）；
警报（“错误”）；
}
});
返回false；
});


问题：当我尝试像这样发送表单时，它只会将我发送到表单操作页面，就像没有使用e.preventDefault（）方法来阻止正常操作一样，但事实上你看到了它

重要事实：当我在click函数外部使用类似so
var answervows=$（“.parent-form1”）的直接名称将值分配给
answervows
var时
它工作得很好，但是如果我直接在click函数中指定名称，它也不起作用（我需要根据父窗体的不同动态指定）

控制台错误：UncaughtTypeError:无法读取未定义的属性“bind”，可能是因为在单击按钮之前未获得
answervows
，但我想这将通过var问题解决


这里有一个jsfiddle:
我认为您的回答投票选择器不匹配，请使用console.log或alert确保您得到了正确的答案：


$(document).ready(function() {
    var answervotes = $(".parent-form1");

    $('#avote_down, #avote_up').on("click",function(e) {
        e.preventDefault();
        answervotes.submit();
    });

    answervotes.on("submit", function(e) {
        e.preventDefault();
        //do ajax
    });
});


下面是一个JSFIDLE：

已解决

我将submit函数嵌套到click函数中，并在执行submit函数后执行表单submit和以下操作：


$('#avote_down, #avote_up').on("click",function(e) {
e.preventDefault();
clase = $(this).parents("form:first").attr('class');
clasedot = '.'+clase; 
answervotes = $(clasedot);
answerdata = answervotes.serializeArray();

answervotes.bind('submit',function () {
$.ajax({
    url: answervotes.attr('action'),
    type: answervotes.attr('method'),
    cache: false,
    dataType: 'json',
    data: answerdata,
    success: function(data) {
        if(data.message == "plus")
        {
            $("#avote_up").attr('class','options options-hover');
            $("#avote_down").attr('class','options');
            $("#atotal-votes").html(data.votes);
            console.log(data.votes);

        }
        if(data.message == "sub")
        {
            $("#avote_down").attr('class','options options-hover');
            $("#avote_up").attr('class','options');
            $("#atotal-votes").html(data.votes);
            console.log(data.votes);

        }
        if(data.name == "register")
        {
            $('.theme-actions').append('<div class="should-login"><span>' + data.message + '</span><div id="close"></div></div>');

            setTimeout(function() {
                $('.should-login').fadeOut(300);
            },4000);

            setTimeout(function() {
                $('.should-login').remove();
            },4300);
        }
        if(data.name == "limited_votes")
        {
            $('.theme-actions').append('<div class="should-login">    <span>' + data.message + '</span><div id="close"></div></div>');

            setTimeout(function() {
                $('.should-login').fadeOut(300);
            },4000);

            setTimeout(function() {
                $('.should-login').remove();
            },4300);
        }
        if(data.name == "repeated_vote")
        {
            $('.theme-actions').append('<div class="should-login"><span>' + data.message + '</span><div id="close"></div></div>');

            setTimeout(function() {
                $('.should-login').fadeOut(300);
            },4000);

            setTimeout(function() {
                $('.should-login').remove();
            },4300);
        }
    },
    error: function(xhr, textStatus, thrownError) {
        console.log(data.message);
        alert("error");
    }
});
return false;
});

answerdata.push({name: encodeURI($(this).attr('name')), value: encodeURI($(this).attr('value'))});
answervotes.submit();
answerdata.pop();
});



$（'#avote_down，#avote_up'）。在（“单击”，函数（e）{
e、 预防默认值（）；
clase=$（this）.parents（“form:first”）.attr（'class'）；
clasedot='.'+clase；
回答票数=$（克拉塞多）；
answerdata=AnswerVoces.serializeArray（）；
answervows.bind（'submit'，函数（）{
$.ajax({
url:answervows.attr（'action'），
类型：answervows.attr（'method'），
cache:false，
数据类型：“json”，
数据：回答数据，
成功：功能（数据）{
如果（data.message==“加”）
{
$（“#avote_up”）.attr（'class'，'options hover'）；
美元（“#avote_down”）.attr（'class'，'options'）；
$（“#原子投票”）.html（data.vows）；
console.log（数据.投票）；
}
如果（data.message==“sub”）
{
$（“#avote_down”）.attr（'class'，'options hover'）；
$（“#avote_up”）.attr（'class'，'options'）；
$（“#原子投票”）.html（data.vows）；
console.log（数据.投票）；
}
如果（data.name==“寄存器”）
{
$（'.theme actions'）.append（''+data.message+''）；
setTimeout（函数（）{
$（'.should login'）.fadeOut（300）；
},4000);
setTimeout（函数（）{
$（'.should login'）.remove（）；
},4300);
}
如果（data.name==“有限投票”）
{
$（'.theme actions'）.append（''+data.message+''）；
setTimeout（函数（）{
$（'.should login'）.fadeOut（300）；
},4000);
setTimeout（函数（）{
$（'.should login'）.remove（）；
},4300);
}
如果（data.name==“重复投票”）
{
$（'.theme actions'）.append（''+data.message+''）；
setTimeout（函数（）{
$（'.should login'）.fadeOut（300）；
},4000);