生成时自动关闭 Div

Posted 2023-05-09

【中文标题】生成时自动关闭 Div

【英文标题】：Div automatically closing as generated

【发布时间】：2015-05-11 09:34:21

【问题描述】：

我的 div 生成有问题，因为我生成了一个表单，我想将它们包装在具有相同 id 的 div 中。但是当我检查元素时，它会在表单之前自动关闭。所以它不会像假设的那样环绕它，它只是在表单上方<div></div>。

var startDiv = "<div id='appm'>";
var endDiv = "</div>";

for(var i = 0; i < values.length; i = i + 8)   

    $('#youEvents').append(     

        $('<form />',  id: values[i], method: 'POST' ).append(
            startDiv, // Starting div id=appm
            $('<textarea />',  id: "teast", name: 'routename', placeholder: 'Name', value: values[i], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'rname', name: 'routename', placeholder: 'Name', value: values[i + 1], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'rname', name: 'routename', placeholder: 'Name', value: values[i + 2], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'rname', name: "ee", placeholder: 'Name', value: values[i + 3], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'rname', name: 'routename', placeholder1: 'Name', value: values[i + 4], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'rname', name: 'routename', placeholder: 'Name', value: values[i + 5], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'address', id: 'rdescription', name: 'heya', value: values[i + 6], type: 'text' ),
            $('<br />'),
            $('<input />',  id: 'adress', name: 'routetags', placeholder: 'tags', value: values[i + 7], type: 'text' ),
            $('<br />'),                                    
            $('<input />',  id: values[i], type: 'button', value: 'Submit',  click: function()
                // attaching the function to the button
                testAjax(this.id);  // Calling the function below.                                                  
            ),
            endDiv // Ending the div         
        )
    );

【参考方案1】：

这是因为jQuery 创建 html 元素div 在附加<div id='appm'> 时，并且包含 结束标记。因此，例如 $('<form />') 符号的结果与 $('<form>') 相同。

为了实现你想要的，你可以通过使用另一个嵌套的.append 来做你已经在做的事情：

$('<form>',  id: values[i], method: 'POST' ).append(
    $('<div>',  id: 'appm' ).append(
        $('<textarea>',  id: "teast", name: 'routename', placeholder: 'Name', value: values[i], type: 'text' ),
        $('<br>'),
        // [...] 
        $('<br>'),                                    
        $('<input>',  id: values[i], type: 'button', value: 'Submit',  click: function() testAjax(this.id);  )
    )
)

【讨论】：

我会，但它需要 15rep :( 我将其标记为答案，这会给你积分吗？