防止用戶添加/追加輸入類型=「按鈕」如果提交的字段爲空

Question

我有一個從輸入字段中添加列表

<div class="container"> 
    <input id="list-input" /> 
    <button id="add">Add To List</button> 
</div> 
<div class="container"> 
    <h1>Your List</h1> 
    <ul id="mylist"> 

    </ul> 
    <button id="clear">clear</button> 
</div> 

的這個簡單的HTML項目，下面是我如何管理我的jQuery中添加列表

$('document').ready(function(){ 
    //add to list function 
    $('#add').click(function(){ 
     var newToList = $('#list-input').val(); 

     $('#mylist').append('<li id="item">' + newToList + '<button id="remove"/></button>' + '</li>'); 

     if(newToList == ""){ 
      alert("Please input some list to do"); 
     } 
     //clear input field 
     $('#list-input').val(''); 
    }); 

}); 

每次我提交一個空字段警報將返回，但按鈕我追加仍顯示。有沒有辦法，我如何追加字段值旁邊的按鈕，如果字段爲空，它不會顯示字段值和旁邊的按鈕？

Answer 1

警報後返回false。

$('#add').click(function(){ 
    var newToList = $('#list-input').val(); 

    if(newToList == ""){ 
     alert("Please input some list to do"); 
     return false; 
    } 
    $('#mylist').append('<li id="item">' + newToList + '<button id="remove"/></button>' + '</li>'); 



    //clear input field 
    $('#list-input').val(''); 

});