2

これは私が取り組んでいるコードです: http://jsfiddle.net/9sX6X/21/

var container = $('.copies'),
    value_src = $('#current'),
    maxFields = 10,
    currentFields = 1;

$('.copy_form').on('click', '.add', function () {
    if (currentFields < maxFields) {
        var value = value_src.val();
        var html = '<div class="line">' +
            '<input id="accepted" type="text" value="' + value + '" />' +
            '<input type="button" value="X" class="remove" />' +
            '</div>';

        $(html).appendTo(container);
        value_src.val('');
        currentFields++;
    } else {
        alert("You tried to add a field when there are already " + maxFields);
    }
})
    .on('click', '.remove', function () {
    $(this).parents('.line').remove();
    currentFields--;
});

追加ボタンが押されたときに入力ボックスに何もない場合、フィールドの追加を停止したいので、たとえば、ユーザーが追加をクリックしてボックスに何もないときにアラートが表示されるようにします。

私はそれがこのようなものだと思いますが、私はjavascriptが初めてです:

if { val == null
alert("Nothing to be added");
}

現在のコードでこのチェックを実装する方法を教えてください。

4

7 に答える 7

1

実際のデモ: http://jsfiddle.net/9sX6X/28/

最初の if ステートメント内で、次のように入力の長さを確認します。

if($.trim(value) != '')

コードを次のように変更します。

var container = $('.copies');
    value_src = $('#current');
    maxFields = 10;
    currentFields = 1;

$('.copy_form').on('click', '.add', function () {
    if (currentFields < maxFields) {

        var value = value_src.val();
        if($.trim(value) != ''){
            var html = '<div class="line">' +
                '<input class="accepted" type="text" value="' + value + '" />' +
                '<input type="button" value="X" class="remove" />' +
                '</div>';

            $(html).appendTo(container);
            value_src.val('');
            currentFields++;
        }else{
            alert('Field empty!');
        }
    } else {
        alert("You tried to add a field when there are already " + maxFields);
    }
})
    .on('click', '.remove', function () {
    $(this).parents('.line').remove();
    currentFields--;
});
于 2013-06-19T13:22:44.273 に答える
1 
if ($.trim(value) != "") {
      var html = '<div class="line">' +
          '<input class="accepted" type="text" value="' + value + '" />' +
          '<input type="button" value="X" class="remove" />' +
          '</div>';

      $(html).appendTo(container);
      value_src.val('');
      currentFields++;
}
else{
     alert("no value")
}

デモ---> http://jsfiddle.net/9sX6X/23/

于 2013-06-19T13:17:38.710 に答える
1 
var container = $('.copies'),
    value_src = $('#current'),
    maxFields = 10,
    currentFields = 1;

$('.copy_form').on('click', '.add', function () {
    if (currentFields < maxFields) {
        var value = value_src.val();
        if (value == "") {
            alert("No input");
        }
        else{
        var html = '<div class="line">' +
            '<input id="accepted" type="text" value="' + value + '" />' +
            '<input type="button" value="X" class="remove" />' +
            '</div>';

        $(html).appendTo(container);
        value_src.val('');
        currentFields++;
       }
    } else {
        alert("You tried to add a field when there are already " + maxFields);
    }
})
    .on('click', '.remove', function () {
    $(this).parents('.line').remove();
    currentFields--;
});
于 2013-06-19T13:18:43.797 に答える
1

デフォルト値はaddであるため、簡単なチェックでうまくいきます。

if (this.value == "Add" || this.value == "") {
    alert("empty!");
    return false;
}

デモ: http://jsfiddle.net/9sX6X/24/

于 2013-06-19T13:18:47.167 に答える
1

これがあなたに基づいたJsFiddleです

追加された部分は次のとおりです。

if ($('#current').val().length <= 0) {
    alert("Nothing to be added");
    return;        
}
于 2013-06-19T13:18:03.533 に答える