某些函数在 .append 之后不起作用
Some functions don't work after .append
我有一个使用自动完成和掩码的工作表单。我决定使我的表单更加用户友好,并开始使用选项卡和ajax来加载内容。要查看所需的表单,我正在使用 .append() 创建一个新选项卡并显示其中的内容,而不是新的浏览器窗口。追加后,新创建的选项卡中应该自动完成的字段不是,而就好像我复制完全相同的字段并粘贴在前面(不在 .append 选项卡中),它具有自动完成功能。面具也是如此。
我的问题是 .append() 究竟是如何工作的?附加后是否必须加载一些 js 和 jquery 函数才能生效?
我不确定,因为您没有显示代码,但是可能是您在元素尚不存在时onReady
内部对元素调用autocomplete()
函数,因为您肯定是在onReady
之后使用append()
动态添加tabs
的内容。
问题是,当您的元素确实存在于您的tab
中时,您必须检查是否调用autocomplete()
。
我给你一个例子,我在tab
上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>
希望这有帮助,
相关文章:
- electronic BrowserWindow的最小高度和宽度在hide()show()方法之后不起作用
- JQuery hide()在show()之后不起作用,反之亦然
- ng模型在$(element).clone()之后不起作用
- CKEditor - 插入文本在 setData 之后不起作用
- UI - 手风琴在 empty() 和 append() 之后不起作用
- Ckeditor插件功能在使用setData(“hai”)之后不起作用;
- Jquery事件在主干呈现中/之后不起作用
- 某些函数在 .append 之后不起作用
- jquery ajax 在 str.rereplace 之后不起作用
- CSS :悬停在 jquery load();之后不起作用
- jQuery .click() 在 replaceWith() 之后不起作用
- JavaScript 在 document.write 之后不起作用
- CSS 在 .after() 之后不起作用
- AngularJS$apply在输入类型范围的ngChange之后不起作用
- ExpressJs的res.sendFile在中间件之后不起作用
- JQuery hide()在fadeIn()之后不起作用
- JavaScript For循环在代码的某一行之后不起作用
- Focus()似乎在onblur()之后不起作用
- ASP.NET ajax函数在onchange事件之后不起作用
- 在此Javascript代码中,setInterval()在clearInterval()之后不起作用