使用JavaScript從jQuery中的數組列表中刪除數組項

Question

我想在每次點擊時刪除數組項。 onclick的get_values按鈕，在刪除按鈕/鏈接的前面顯示數組項。 我需要在每次單擊刪除按鈕時刪除這些項目。 它刪除整個項目，但我要一個接一個。 請幫我。 我是jquery新手。

<html>
<body>
<div id="array_container"> 
<label>Name</label>
<input type="text" name="name1" value="" /> 
<label>State</label>
<input type="text" name="name1" value="" /> 
<label>Color</label>
<input type="text" name="name1" value="" /> 
<input type="button" name="get_value" id="get_value" value="Get Value"/> 
</div>
<div id="myDiv"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!--<script src="../js/jquery.min.js"></script>-->
<script type="text/javascript">
    $("#get_value").click(function () 
    {   //causing error here removed the array in name value
        var ListOfArray = [];
        var option = $('input:text[name=name1]').map(function() 
        {   
           return $(this).val();
        }).get().join();
        $("input:text[name=name1]").val("");
        ListOfArray.push(option);
        for (var i= 0; i < ListOfArray.length; i++)
        {  
            alert(i); //alert(ListOfArray.length);
            var newList = "<a href='#' onClick='removeArray(" + i + ");'return false;> DELETE </a> " + option + " <br>";
            alert(newList); //alert(i);
        };
        document.getElementById('myDiv').innerHTML += newList;
        return true;
    });
    function removeArray(i)  
    {   
        var ListOfArray = [];
        alert('after removed array.'+i);
        ListOfArray.splice(i,1);
        var newList = "";
        //console.log(ListOfArray); 
        for (var i = 0; i < ListOfArray.length; i++)
        {   //You refer to option here for element, which should be replaced by proper index of array
          alert(ListOfArray.length);  alert(i); 
          newList += "<a href='#' onClick='removeArray(" + i + ");'return false;> DELETE </a> " + ListOfArray[i] + " <br>";
           alert(i); 
        };
        document.getElementById('myDiv').innerHTML = newList;
        return true;
    }   
</script>
</body>
</html>

Answer 1

當前，ListofArray是onclick處理函數的局部變量，removeArray函數無法從外部范圍訪問它。 另外，您在removeArray中聲明了一個新變量。 您需要做的是將ListofArray變量保留為兩個函數共享的單個實例。

喜歡

 var ListOfArray = []; $("#get_value").click(function () { //causing error here removed the array in name value var option = $('input:text[name=name1]').map(function() { return $(this).val(); }).get().join(); $("input:text[name=name1]").val(""); ListOfArray.push(option); for (var i= 0; i < ListOfArray.length; i++) { alert(i); //alert(ListOfArray.length); var newList = "<a href='#' onClick='removeArray(" + i + ");'return false;> DELETE </a> " + option + " <br>"; alert(newList); //alert(i); }; document.getElementById('myDiv').innerHTML += newList; return true; }); function removeArray(i) { alert('after removed array.'+i); ListOfArray.splice(i,1); var newList = ""; //console.log(ListOfArray); for (var i = 0; i < ListOfArray.length; i++) { //You refer to option here for element, which should be replaced by proper index of array alert(ListOfArray.length); alert(i); newList += "<a href='#' onClick='removeArray(" + i + ");'return false;> DELETE </a> " + ListOfArray[i] + " <br>"; alert(i); }; document.getElementById('myDiv').innerHTML = newList; return true; }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="array_container"> <label>Name</label> <input type="text" name="name1" value="" /> <label>State</label> <input type="text" name="name1" value="" /> <label>Color</label> <input type="text" name="name1" value="" /> <input type="button" name="get_value" id="get_value" value="Get Value"/> </div> <div id="myDiv"></div>

使用JavaScript從jQuery中的數組列表中刪除數組項

問題描述

1 個解決方案

解決方案1
1 2014-09-24 12:49:07

使用JavaScript從jQuery中的數組列表中刪除數組項

問題描述

1 個解決方案

解決方案1 1 2014-09-24 12:49:07

解決方案1
1 2014-09-24 12:49:07