Как я могу удалить элемент из массива

Question

1. необходимо преобразовать входное значение типа массива [[X,Y,Z],[A,B,C]]
2. Я хочу, чтобы удалить элемент из массива только по щелчку.

$(".btn-primary").click(function() { 
 
    var nbrOfList = 2; // number of item went to remove 
 
    var _data1 = $('#listAllEmp').val(); // default value 
 
    var _data2 = eval("[" + _data1 + "]"); // convert as array 
 

 
    var itemtoRemove = _data2[nbrOfList-1]; // itemtoRemove from array 
 
    _data2.splice($.inArray(itemtoRemove ,_data2),1); // Remove from array 
 

 

 
    jQuery('#listAllEmp').val('[' + _data2 + ']'); // new value after remove 
 
    $('p').text('[' + _data2 + ']') 
 
    
 
});

<input type="hidden" name="" id="listAllEmp" value='["job name 1","nat 1"],["job name 2","nat 2"],["job name 3","nat 3"]' /> 
 

 
<a title="" class="btn btn-primary" href="javascript:void(0);">remove 2 item</a> 
 
<p></p>

Answer 1

использование JSON.stringify

jQuery('#listAllEmp').val(JSON.stringify(_data2)); 
     $('p').text(JSON.stringify(_data2)) 

и JSON.parse вместо Eval (Использование Eval не очень хорошая практика)

JSON.parse('[["job name 1","nat 1"],["job name 2","nat 2"],["job name 3","nat 3"]]') 

Answer 2

Простой и правильное регулярное выражение для входного значения для преобразования массива. Затем после удаления или вставки элементов выполняется простая реализация карты для возврата значения в строку, которая должна быть вставлена ​​в ваш элемент DOM.

Итак, если у вас есть этот массив, вы можете удалить или добавить элементы к нему через прослушиватель событий и вставить его обратно в свойство значения элемента. Хорошо, давайте предположим, что мы хотим удалить элемент с индексом 1. Пожалуйста, смотрите следующий код

var _data1 = '["job name 1","nat 1"],["job name 2","nat 2"],["job name 3","nat 3"]', 
 
     reg = /([^"]+)","([^"]+)/g, 
 
    _data2 = []; 
 

 
while(_data2[_data2.length]=reg.exec(_data1)); 
 
_data2 = _data2.slice(0,-1).map(c => c.slice(1,3)); // now we have our array in _data2 
 

 
document.write("<pre>" + JSON.stringify(_data2) + "</pre>\n"); 
 

 
_data2.splice(1,1); // item at index 1 is removed from _data2 
 
_data1 = _data2.map(e => "[" + e + "]").join(","); // _data1 is ready to be sent to value 
 

 
document.write("<pre>" + JSON.stringify(_data1) + "</pre>\n");

Answer 3

Попробуйте изменить код немного ниже, надеюсь, что он может выполнить ваши потребности.

$(".btn-primary").click(function() { 
 
    var nbrOfList = 2; 
 
    var data1 = $('#listAllEmp').val(); // default value 
 
    var _data2 = data1.split("],["); // convert as array 
 
    
 
    $('#test').html("<b>Before Remove</b>:--<pre>"+_data2+"</pre>"); //Before remove 
 
     
 
    //_data2.pop(2); //Removing last element 
 
    _data2.splice((_data2.length)-2,nbrOfList) 
 
    
 
    $('#test').append("<b>After each click</b>:--<pre>"+_data2+"</pre>"); //After Remove 
 
     
 
    var numbersString = _data2.join('],['); // Again making string to follow your format 
 
     
 
    //Assigning new value to textbox 
 
    if(numbersString == "") 
 
    $('#listAllEmp').val(""); 
 
    else 
 
    $('#listAllEmp').val(numbersString+"]"); 
 
    
 
    $('#test').append("<b>New String</b>:-- "+$('#listAllEmp').val()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="hidden" name="" id="listAllEmp" value='["job name 1","nat 1"],["job name 2","nat 2"],["job name 3","nat 3"]' /> 
 

 
<a title="" class="btn btn-primary" href="javascript:void(0);">remove 2 item</a> 
 
<p></p> 
 
<div id="test" style="width:100%;height:50%;"></div>