0

我有这个代码:

// 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()+"</li>");

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

http://jsfiddle.net/ZTuDJ/40/

我正在尝试将“删除”与添加责任时列表中出现的每个项目右对齐。这是我尝试过的代码,但它阻止了 javascript 的工作,而且似乎是蹩脚的标记。谁能指出我应该如何做到这一点的正确方向。

JS

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

CSS

.right { float: right; }
4

2 回答 2

2

您的代码由于"in<span class="right"><a href="#">Remove</a></span>

因为,除了 LI,您不能在 UL 中添加其他元素,您可以remove在 li 中添加您的内部

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

演示---> http://jsfiddle.net/ZTuDJ/42/

于 2013-06-18T19:55:10.263 回答
1

这个小提琴可能会帮助你!

JS

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

CSS

.right {
    float: right;
}
于 2013-06-18T19:57:42.840 回答