如何解决使用 Jquery 克隆 HTML 元素并将单个按钮附加到每个
我正在使用 AngularJS 和 Jquery 制作表单构建器。我可以将我的表单元素从侧边栏拖放到主下拉屏幕(表单编辑屏幕)上。 我还能够使用一个简单的 AngularJS 函数为每个克隆添加重复的 ID,该函数不断增加 id 值并将其附加到克隆元素。
这是我的克隆过程代码:
$( "#dropzone" ).droppable(
{
accept: ".divinner",drop: function( event,ui ) {
$scope.incid();
var cloned = $(ui.draggable).clone(true).attr('id',$scope.setid());
var clonedfinal = $compile(cloned)($scope);
$(this).append(clonedfinal);
$("#dropzone .divinner").addClass("item");
$(".item").removeClass("ui-draggable divinner");
$(".item .hidden").removeClass("hidden");
}
})
以下是我用于表单元素的 html 代码的一部分(它们被克隆到下拉屏幕上):
<div class = "ui-widget-content divinner" style="width: 100%; height: 50px; padding: 0.5em; background:#bfbfbf;">
<input type="button" value="Button" style="height: 2.5em;">
<div class="hidden">
<input type="button" value="Settings" style="position:absolute; right: 5%">
<div class="settingsmenu" style="display: none; z-index: 1; border: 1px solid black; position:absolute;">
Button Name: <input type="text"><br>
Button ID: <input type="text"><br>
<input type="button" value="Update">
</div>
</div>
</div>
现在我面临的问题是只为正在单击的元素克隆(设置按钮)打开一个特定的设置菜单。我尝试使用 Angular Scope 变量,但正如预期的那样,一次打开了所有克隆的所有设置菜单。 我尝试使用 getElementById 获取 Document 元素,但这给了我一个“null”。
我是 JQuery 和 Angular 的新手。任何有关此问题指导的帮助将不胜感激。
谢谢
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。