我能够创建评论框喜欢和评论按钮使用下面的代码,但我想添加另一个文本框当用户点击评论链接。
如何添加另一个文本框当我点击下面的代码注释链接
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#cbox").keypress(function(e){
var key=e.which;
if(key==13)
{
var i=0;
$("#cbox").each(function(){
var data=$(this).val();
$("#cdv").append('<div style="background-color:gray">'+data+'</div>'+'<div>'+'<a href="#" id="link'+i+'" style="text-decoration:none;font-family:calibari;font-size:15px">Like</a>'+' '+' '+'<a href="#" id="cmnt'+i+'" style="text-decoration:none">Comment</a>'+'</div>');
});
i++;
}
});
});
</script>
</head>
<body>
<input type="text" id="cbox" />
</br>
</br>
<div id="cdv" style="background-color:#FF00BF;height:auto;width:300px">
</body>
</html>
改变这一行:
$("#cdv").append('<div style="background-color:gray">'+data+'</div>'+'<div>'+'<a href="#" id="link'+i+'" style="text-decoration:none;font-family:calibari;font-size:15px">Like</a>'+' '+' '+'<a href="#" id="cmnt'+i+'" style="text-decoration:none">Comment</a>'+'</div>');
$("#cdv").append('<div style="background-color:gray">'+data+'</div>'+'<div>'+'<a href="#" id="link'+i+'" style="text-decoration:none;font-family:calibari;font-size:15px">Like</a>'+' '+' '+'<a href="#" id="cmnt'+i+'" style="text-decoration:none" class='comment-link'>Comment</a>'+'</div>');
注意我在你的链接后面加了class='comment-link'。
不,我们可以给每个链接附加一个onlick句柄,像这样:
<script>
$(function(){
$("body").on(".comment-link","click", function(){
$(this).append("<input type='text' class='added-input'/>")
});
});
<script>