Question

这是我的提醒示例：alert("Limit reached");

这是我目前的代码：http://jsfiddle.net/spadez/LRFMQ/3/

var MaxInputs = 8; //maximum input boxes allowed
var InputsWrapper = $("#InputsWrapper"); //Input boxes wrapper ID
var AddButton = $("#addfield"); //Add button ID

var x = InputsWrapper.length; //initlal text box count
var FieldCount = 1; //to keep track of text box added

$(AddButton).click(function (e) //on add input button click
{
    if (x <= MaxInputs) //max input box allowed
    {
        FieldCount++; //text box added increment
        //add input box
        $('<div><input type="text" name="mytext[]" id="field_' + FieldCount + '" value="Text ' + FieldCount + '"/><button class="removeclass">Delete</button></div>').insertBefore(InputsWrapper);          
        x++; //text box increment          
    }
    // Should I put the alert HERE ?
    return false;
});

$("body").on("click", ".removeclass", function (e) { //user click on remove text
    $(this).parent('div').remove(); //remove text box
    x--; //decrement textbox
    return false;
})

如何将此警报集成到我的代码中，以便在添加过多输入时看到警报？

我以为我必须把它放在第16和第17行之间，但这似乎没有正确触发。

Answer 1

你几乎完成了所有的工作，只需要添加一个else语句：

if (x <= MaxInputs) //max input box allowed
{
    FieldCount++; //text box added increment
    //add input box
    $('<div><input type="text" name="mytext[]" id="field_' + FieldCount + '" value="Text ' + FieldCount + '"/><button class="removeclass">Delete</button></div>').insertBefore(InputsWrapper);
    x++; //text box increment
} 
else 
{
    alert("Limit reached");   
}

Answer 2

看看这个小提琴，这应该是你要找的 Fiddle

var MaxInputs = 8; //maximum input boxes allowed
var InputsWrapper = $("#InputsWrapper"); //Input boxes wrapper ID
var AddButton = $("#addfield"); //Add button ID

var x = InputsWrapper.length; //initlal text box count
var FieldCount = 1; //to keep track of text box added

$(AddButton).click(function (e) //on add input button click
{
    if (x <= MaxInputs) //max input box allowed
    {
        FieldCount++; //text box added increment
        //add input box
        $('<div><input type="text" name="mytext[]" id="field_' + FieldCount + '" value="Text ' + FieldCount + '"/><button class="removeclass">Delete</button></div>').insertBefore(InputsWrapper);
        x++; //text box increment
    } else {
        alert("Limit reached");
    }
    return false;
});

$("body").on("click", ".removeclass", function (e) { //user click on remove text
    $(this).parent('div').remove(); //remove text box
    x--; //decrement textbox
    return false;
})

Answer 3

$(AddButton).click(function (e) //on add input button click
{
    if (x <= MaxInputs) //max input box allowed
    {
        FieldCount++; //text box added increment
        //add input box
        $('<div><input type="text" name="mytext[]" id="field_' + FieldCount + '" value="Text ' + FieldCount + '"/><button class="removeclass">Delete</button></div>').insertBefore(InputsWrapper);
        x++; //text box increment
    } else {
        alert("tto many inputs");
    }
    return false;
});

Your updated fiddle

添加现有警报

3 个答案: