1

我整天都在研究我的第一个 javascripts，它旨在让用户使用字段和提交按钮将项目插入文本框。放在列表中的项目旁边有一个删除按钮。

我想知道是否有人对如何使用列表旁边的删除链接删除项目有任何聪明的想法。单击此链接时，我希望将其从列表中删除，但我真的看不到干净简单的方法。

演示 Jsfiddle：http: //jsfiddle.net/spadez/ZTuDJ/46/

// If JS enabled, disable main input
$("#responsibilities").prop('disabled', true);
// $("#responsibilities").addClass("hidden");

// If JS enabled then add fields
$("#resp").append('<input placeholder="Add responsibility" id="resp_input" ></input><input type="button" value="Add" id="add"> ');

// Add items to input field
var eachline='';
$("#add").click(function(){
    var lines = $('#resp_input').val().split('\n');
    var lines2 = $('#responsibilities').val().split('\n');
    if(lines2.length>10)return false;
    for(var i = 0;i < lines.length;i++){
        if(lines[i]!='' && i+lines2.length<11){
        eachline += lines[i] + '\n';
        }    
    }

    $('#responsibilities').text($("<div>" + eachline + "</div>").text()).before("<li>"+$("<p>"+lines+"</p>").text()+"<span class='right'><a href='#'>Remove</a></span></li>");

    $('#resp_input').val('');
});

我知道人们有更多的经验，所以如果有人愿意就如何实现这一点给我任何帮助或建议，我会非常感激。

4

2 回答 2

6

真的很简单：

$(document).on('click', '.right a', function(){
    $(this).closest('li').remove()
})

小提琴：http: //jsfiddle.net/ZTuDJ/47/

要也删除 textarea，请使用以下命令：

$(document).on('click', '.right a', function(){
    var el = $(this).closest('li')
    var index = $('li').index(el);
    var text = eachline.split('\n');
    text.splice(index, 1);
    eachline = text.join('\n')
    $('#responsibilities').text(eachline)
    el.remove()
})

小提琴：http: //jsfiddle.net/ZTuDJ/50/

于 2013-06-18T20:26:20.607 回答
1

像这样的东西？：

$("ul li a").on("click", function(){
    $(this).parent().remove();
});

JSFiddle在这里

于 2013-06-18T20:25:50.857 回答