javascript - 使用 jQuery 和 HTML 添加到 div

标签 javascript jquery html css

所以我的代码有一些问题。我试图删除一个链接 (a),然后添加一个具有不同文本的新链接 (a)。

这是代码

HTML:

<label for="name" class="control-label">Username:</label> 
@<a href="<?php echo $username ?>">
    <p class="text-info-username">
        <?php echo strtolower($username) ?><i class="icon-star"></i></a></p>
<div class="controls-username">
    <a href='#' id="edit-username" class="btn"><i class="fa fa-pencil"></i> Edit</a>
</div>

脚本:

$('#edit-username').click(function() {
 var text = $('.text-info-username').text();
 var input = $('<input type="text" placeholder="' + text + '" id="editTextBox" />')

 $('.text-info-username').text('').append(input);
 $('#edit-username').remove();
 $('<a href='#' id="update" class="btn">Update</a>').appendTo('.controls-username');
 $('<br /><br />').insertAfter('.controls-username');

});

最佳答案

我认为您的报价有问题。这是 JS 的修订版本:

$('#edit-username').click(function() {
 var text = $('.text-info-username').text();
 var input = $('<input type="text" placeholder="' + text + '" id="editTextBox" />');

 $('.text-info-username').text('').append(input);
 $('#edit-username').remove();
 $('<a href="#" id="update" class="btn">Update</a>').appendTo('.controls-username');
 $('<br /><br />').insertAfter('.controls-username');

});

还有一个 jsFiddle: http://jsfiddle.net/qhcf39oo/

关于javascript - 使用 jQuery 和 HTML 添加到 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28643860/

相关文章:

javascript - 正则表达式查找单词的最佳匹配子集

javascript - 如何在不使用each的情况下访问复选框数组的第一个元素?

javascript - 保存 SVG,背景图像被遗漏

javascript - 嗨,我无法让 CSS 旋转动画工作?使用最新版本。更新 : running on Chrome

html - HTML 表格末尾的旋转 Div

javascript - NW.js + 通天塔 : ES6 import working but not export?

javascript - JQuery 无法从动态创建的字段中获取输入值

javascript - 如何验证 Bootstrap 中的密码字段?

html - 使用 CSS 拆分条形图

javascript - .svg ('get' ) 是什么意思?