3

我正在使用一些 JavaScript 来创建新的 HTML 元素，然后使用 MooTools 注入方法返回它们。

 display: function() {
        var threadTitle = new Element('h2',{
            'class': 'postItem',
            'data-id': this.id,
            'text': this.title,
            'href': '#',
            events: {
                click: function(){
                    $('newComment').setStyle('visibility', 'visible');
                    var id = this.get('data-id');
                    $('thread').value = id;
                    callThread(id);
                }
            }
        });

        var deleteT = new Element('a',{
            'class': 'deleteItem',
            'data-id': this.id,
            'text' : 'Delete',
            'href' : '#',

            events: {
                click: function(){
                    var deleteID = this.get('data-id');
                    deleteThread(deleteID)
                }
            }
        });

        var editBtn = new Element('input',{
            'class': 'mt-btn',
            'value': 'Edit',
            'type': 'button',
            'data-id': this.id,
            'text' : 'Edit',
            'href' : '#',
            events: {
                click:  function(){


                }
            }
        });



        deleteT.inject(threadTitle);
        editBtn.inject(threadTitle);
        return threadTitle;
    }
});

当我注入它时，这显然会返回 h2 内部的新元素。有没有办法在 H2 之外创建每一个，所以在某种意义上

<h2></h2>
<a></a>
<input></input>

我尝试过使用 MooTools 的使用方式，editBtn.inject(threadTitle, 'after');但这似乎不起作用，并且没有任何返回。因此，问题是我如何将页面上的元素一个接一个地返回，而不是注入到 h2 元素中。

4

1 回答 1

1

我尝试过使用 MooTools 的使用方式，editBtn.inject(threadTitle, 'after');但这似乎不起作用，并且没有任何返回。

它认为问题在于，threadTitle在你这样做的时候，没有父母。如果它没有父元素，MooTools 将很难在它“之后”注入任何东西，因为这样做需要它注入父元素。

如果您threadTitle先放入 DOM，我怀疑editBtn.inject(threadTitle, 'after');这样可以正常工作。

比较一下，这不起作用：Live Copy

var p = new Element('p');
p.set("html", "This is the <code>p</code> element");

var div = new Element('div');
div.set("html", "This is the <code>div</element> inserted <em>after</em> the <code>p</code>");
div.inject(p, 'after');

p.inject(document.body);

...有了这个，它可以：Live Copy

var p = new Element('p');
p.set("html", "This is the <code>p</code> element");
p.inject(document.body);

var div = new Element('div');
div.set("html", "This is the <code>div</element> inserted <em>after</em> the <code>p</code>");
div.inject(p, 'after');

...不同之处在于，p在我们尝试注入div之后，该元素已被添加到 DOM 中。

于 2013-05-08T21:25:36.530 回答