jQuery的前面加上一个按钮元素

嘿所有我有下面的代码，增加了一个DUP按钮，我的表：jQuery的前面加上一个按钮元素

.....[More code above]..... 
_createDeleteButton: function (a) { 
    return this._createGridButton(this.deleteButtonClass, 
           this.deleteButtonTooltip, function (b, c) { 
    b.deleteItem(a), c.stopPropagation() 
    }) 
}, 
_createGridButton: function (a, c, d) { 
    var e = this._grid; 
    //Creates the Dup button 
    var r = $('<input/>').attr({ 
     type: "button", 
     id: "field", 
     value: 'new', 
     class: "dup" 
     }).on("click", function (a) { 
      alert('hello'); 
     }) 

    //Creates the DELETE button 
    return b("<input>").addClass(this.buttonClass).addClass(a).attr({ 
       type: "button", 
       title: c 
     }).on("click", function (a) { 
      d(e, a) 
     }).prepend(r); 
}, 
.....[More code below].....

最终的结果看起来是这样的：

注意如何dup元件是内删除元件！

我也tryed如下：

}).after(r);

哪些不必须的DUP元素在所有...

}).insertAfter(r);

而且再次它d OES不显示DUP元素...

}).before(r);

还没显示DUP ...

}).append(r);

这同样有效，但地方dup到不正确的地方...

}).prepend(r);

而且同样适用于这一个以及..

//Creates the DELETE button 
var a = b("<input>").addClass(this.buttonClass).addClass(a).attr({ 
     type: "button", 
     title: c 
}).on("click", function (a) { 
     d(e, a) 
}); 
return $(r).insertAfter(a);

犯规显示删除元素现在但确显示Dup element ...

那么我做错了什么？我期待有它看起来像这样：

来源

2017-07-03 StealthRT

当然不能使用'prepend'或'append'因为一个' '不能生小孩。简单的修复方法是将它们包裹在一个范围内，并将其放入范围 – charlietfl

也许它的工作原理与$(r).insertAfter("<delete button>")。

来源

2017-07-03 13:15:57 zuluk

检查我更新的OP。它确实有效，但失去了另一个元素...... – StealthRT

$("div").prepend("<input>")表示在元素内插入输入，但在开始。

$("div").append("<input>")表示在元素内插入输入，但在末尾处插入输入。

$("div").after("<input>")装置插入输入div

$("div").before("<input>")装置之后插入输入之前div

prependTo/appendTo和insertBefore/insertAfter它们是同上述那些，但elemens颠倒右，例如$("<input>").prependTo("div")

据我所知，你想insertAfter删除按钮。如果a是删除按钮，然后$(r).insertAfter(a)应该工作

见下面的例子，其中a里面div的p。

也许是为了工作片段，以了解是否正确创建您的按钮，因为我不能复制你的问题

var r = $('<input/>').attr({ 
 
    type: "button", 
 
    id: "field", 
 
    value: 'new', 
 
    class: "dup" 
 
}).on("click", function(a) { 
 
    alert('hello'); 
 
}) 
 
var a = $('div p') 
 
$(r).insertAfter(a);

/* CASE STUDY */ 
 

 
body { 
 
    margin: 0; 
 
} 
 

 
section#casestudy { 
 
    height: 750px; 
 
    max-width: 100%; 
 
} 
 

 
section#casestudy div.row { 
 
    height: 250px; 
 
    max-width: 100%; 
 
    text-align: center; 
 
    position: relative; 
 
} 
 

 
section#casestudy .four { 
 
    position: relative; 
 
    max-width: 100%; 
 
    display: inline-block; 
 
    margin: 0 auto; 
 
} 
 

 
#casestudy h4 { 
 
    color: #000000; 
 
    font-size: 20px; 
 
    padding-top: 50px; 
 
    line-height: 5px; 
 
} 
 

 
section#casestudy p { 
 
    font-size: 10px; 
 
    color: #bdc3c7; 
 
    position: absolute; 
 
    top: 50%; 
 
    left: 50%; 
 
    margin-right: -50%; 
 
    transform: translate(-50%, -50%) 
 
} 
 

 
#council div.row { 
 
    display: block; 
 
    background-color: #d3d3d3; 
 
    width: 960px; 
 
} 
 

 
#council img { 
 
    float: right; 
 
} 
 

 
#council h2 { 
 
    font-size: 20px; 
 
    text-align: left; 
 
    color: #000000; 
 
} 
 

 
#council div.row p { 
 
    font-size: 10px; 
 
    text-align: left; 
 
    width: 50%; 
 
} 
 

 
.four h3 { 
 
    position: absolute; 
 
    color: #FFF; 
 
    font-size: 20px; 
 
    margin: 0; 
 
    top: 50%; 
 
    left: 50%; 
 
    transform: translate(-50%, -50%); 
 
} 
 

 
section#casestudy img { 
 
    display: block; 
 
    margin-left: 20px; 
 
    padding: 10px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <p> 
 
    Some text here 
 
    </p> 
 
</div>

来源

2017-07-03 13:34:58

jQuery的前面加上一个按钮元素

回答

相关问题