0

我的问题是当我尝试附加一个输入框时，它变得不活动。我的意思是我不能把任何东西放进去。

我正在使用 HTML 导入并将输入附加到导入的元素中

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
    
    <html lang="en" xmlns="http://www.w3.org/19enter code here99/xhtml">
    <head>
        <meta charset="utf-8" />
        <title>Feedback Form</title>
        <link rel="import" href="background.html">
        <script type="text/javascript" src="jquery-3.1.1.js"></script>
    <body>
        <script>
            var link = document.querySelector('link[rel=import]');
            var content = link.import.querySelector('#background');
            document.body.appendChild(content.cloneNode(true));
        </script>
        <div id="email_form">
            <p>E-mail: <input type="email" id="email_from_email" name="email_from_email" /></p>
        </div>
      <script>  
     $("#email_form").appendTo("#maincontent"); //here I append input
      </scrit>
    </body>
    </html>

背景.html

<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="background.css" />
</head>
<body>
    <div id="background">
        <div class="background" id="menucontent">
            <!--some code here-->
            </div>
        </div>
        <div class="background" id="maincontent">
            <!--An input is appendend but I can't put anything in-->
        </div>
    </div>
</body>
</html>
4

1 回答 1

1

该元素#maincontent不在主文档index.html中，而是在导入的文档background.html中。

所以你不能使用 jQuery 库来选择它.appendTo( "#maincontent" )。

相反，您应该以与您相同的方式选择它#background：

var maincontent = link.import.querySelector('#maincontent');

注意：我不明白您为什么要在导入的文档中插入一些未呈现的元素。通常我们在相反的方向执行操作。

于 2017-04-18T07:11:00.167 回答