Question

我正在生成表单，并在名称字段中为每个生成的表单提供前缀。我以前做过几次增量，但有些事情导致变量不增加。这基本上就是代码。

// Start at 2 because form 1 is in document already
var food_number = 2;
var food_form = '<input name="food_name_' + food_number + '"/>';

$(document).ready(function()
{
    $('#add_food_form').click( function(){
        $('#food-forms-cnt').append(food_form);
        food_number = food_number + 1;
    });
});

我在增量线上尝试了以下变化。

food_number = food_number + 1;
food_number++;
++food_number;

除了创建一个单独的变量i并使用它来增加变量food_number。我创建的每个表单的结果都是这个。

<input name="food_name_2"/>

我猜测当函数完成时，变量不会保留新值。那是对的吗？如果是这样，我怎样才能让变量保持其值。如果这不正确，会发生什么。

Answer 1

您food_form的名称始终为food_name_2，因为您没有更新它。您只是更新food_number。

您可能会认为food_form会自动更新，因为它的引用为food_number，但现在不是food_form，只是String，没有关于{的信息{1}}参考。

food_number

Answer 2

您在处理程序中成功递增food_number，问题是您已将其连接到food_form HTML字符串中。要修复它，您必须在处理程序中重新生成字符串：

// Start at 2 because form 1 is in document already
var food_number = 2;
var food_form_tem = '<input name="food_name_${food_number}"/>';

$(document).ready(function()
{
    $('#add_food_form').click( function(){
        food_form = food_form_tem.replace('${food_number}',food_number);
        $('#food-forms-cnt').append(food_form);
        ++food_number;
    });
});

http://jsfiddle.net/d1vf4amq/

无法在点击时增加javascript变量

2 个答案: