1

http://jsfiddle.net/TDmRv/1/

我想要做什么：我希望将 id 为“theDiv”的 div 包裹在输入到页面上的文本周围。我想要这个，所以文本将出现在创建的多个 div 中。

解释更多： 好的，所以我要做的是输入一些输入并将其显示在一个 div 中，这很好，但我希望 div 在我单击输入时环绕它。因此，每次我单击“添加”时，文本都会被包装到一个 div 中并显示出来。但我也试图让它出现多次，所以每次我添加输入时，div 都会包裹在文本周围。最后，我试图将这两个按钮放在那里，我假设当使用 jQuery 单击“添加”时必须插入这些按钮。我只需要一些指导，因为我很难理解这将如何工作。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("#edit").click(function(){
    $("#theDiv").css("background-color","red");
  });
});
$(document).ready(function(){
  $("#delete").click(function(){
    $("#theDiv").remove();
  });
});
$(document).ready(function(){
  $("#add").click(function(){
    $('#edit').wrap('<div class="theDiv" />');
  });
});
</script>
<style>
#theDiv {   
    border: 1px solid rgb(204, 204, 204); 
    margin: 5px 0pt; 
    padding: 5px;
    background-color: blue;
    height:50px;
    }
button {
    float:right;
}
</style>
</head>
<body>
<div id="hold">
<button id="edit">Edit</button><button id="delete">Delete</button>
</div>
<form>
    <div><textarea class="textI" id="textI2" style="width: 400px; height: 50px;"></textarea></div>
    <div><input type="button" id="add"value="add" onclick="theDiv_append()" /></div>
</form>
<script language="javascript">
$('.textI').each(function() {
    var default_value = this.value;
    $(this).focus(function() {
        if(this.value == default_value) {
            this.value = '';
        }
    });
});
function theDiv_append() {
    $('#theDiv').append($('#textI2').val());
}
</script>
</body>
</html>
4

1 回答 1

3

试试这个，把#add click改成这个，它在jsfiddle中工作，只需添加文本，我没有这样做，但你会看到如何添加新的蓝色div

            $("#add").click(function(){
             var newRow = $('#theDiv').clone();
             $('#hold').append(newRow);
             $('#edit').wrap('<div class="theDiv" />');
               });
           });
于 2012-07-13T02:42:33.370 回答