我有一个使用 autocomplete 的工作表单和 mask 。我决定让我的表单更加用户友好，并开始使用 tabs和 ajax加载内容。要查看我正在使用的所需表格 .append()创建一个新选项卡并显示其中的内容，而不是新的浏览器窗口。追加后，新创建的选项卡内的字段(本应自动完成)并非自动完成，而就好像我复制完全相同的字段并粘贴在前面(不在 .append 选项卡中)，它有 自动完成。面具也是如此。
我的问题是.append()到底是怎么做的？工作？我是否必须在 append 后加载一些 js 和 jquery 函数才能使其生效？
最佳答案
我不确定，因为您没有显示代码，但是当您的元素处于 onReady 内部时，您可能会在 onReady 内调用 autocomplete() 函数尚未存在，因为您肯定会在 onReady 之后使用 append() 动态添加 tabs 的内容。
问题是，当您的元素确实存在于选项卡中时，您必须检查是否调用了autocomplete()。
我给你一个例子，我在选项卡上 append 和元素，然后当该元素存在时我调用autocomplete()，并且工作正常。检查一下:
$(function() {
$( "#tabs" ).tabs();
$('#appendButton').click(function(){
// create auto
var $auto = $('<div class="ui-widget"><label for="tags">Tags: <\/label><input id="tags"><\/div>');
// append auto
$('#tabs-1').append($auto);
console.log('autocomplete');
// once is appened start autocomplete
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$('#tags').autocomplete({
source: availableTags
});
});
});<html lang="en">
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
</ul>
<div id="tabs-1">
<p> <input id="appendButton" type="button" onclick"appendAuto();" value="appendAuto" /></p>
</div>
</div>
</body>
</html>希望这有帮助，
关于javascript - 某些功能在 .append 之后不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28288595/