使用手风琴和“性感组合”插件
我是个新手,遇到了以下问题...
案例:
我们有一个手风琴,在这个手风琴中我们遇到了一个性感组合框
<html>
<head>
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/lib/jquery.sexy-combo-2.1.2.min.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/examples/usage.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/jquery.autogrow.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/lib/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/lib/jquery.bgiframe.min.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/development-bundle/ui/ui.core.js"></script>
<script type="text/javascript" src="../../../../Library/WebServer/Documents/sexy-combo/development-bundle/ui/ui.accordion.js"></script>
<link rel="stylesheet" type="text/css" href="../../../../Library/WebServer/Documents/sexy-combo/lib/sexy-combo.css" />
<link rel="stylesheet" type="text/css" href="../../../../Library/WebServer/Documents/sexy-combo/skins/sexy/sexy.css" />
<script type="text/javascript">
$(document).ready(function(){
$("#accordion").accordion();
$("#basic-combo").sexyCombo();
});
</script>
</head>
<body style="font-size:62.5%;">
<div id="accordion">
<h3><a href="#">Form A</a></h3>
<div>
<p>Please fill out the following:</p>
<p>1. What cookies do you like?</p>
<p><select id="basic-combo" name="resObj" size="2">
<option>jelly</option>
<option>biscuit</option>
<option>chocolate</option>
</select>
</p>
<p>2. What ice cream do you like?</p>
<p><select id="empty-combo" name="sort" size="2">
<option>strawberry</option>
<option>chocolate</option>
<option>vanilla</option>
</select></p>
<p>3. please tell us, how did you get attention to this site?</p>
<p>
<textarea style="width: 400px; height: 84px; min-height: 80px;" class="expanding" name="myTextarea"></textarea>
</p>
</div>
<h3><a href="#">Form B</a></h3>
<div>
<p>4. Please tell us the minimum and max amount of chocolate that you eat:</p>
<p>min
<input name="minConsump" type="text" id="start" size="5" />
max
<input name="maxConsump" type="text" id="finish" size="5" />
required time (in minutes) that you take to eat the amount
<input name="reqTime" type="text" id="time" size="5" />
</p>
</div>
</body>
</html>
问题: - 手风琴工作正常,但性感组合不行,你只能看到“正常”选择框
已经尝试过/奇怪的现象: - 删除 $("#accordion").accordion();导致性感组合起作用的
可能原因: - 手风琴在性感组合对象之前启动...毕竟性感组合对象没有被加载或被手风琴对象某种“隐藏”,
有人知道这种行为的原因是什么吗?或者如何解决它?
读完这里的一些主题后,我发现了一些东西。像 jQuery live 插件一样,也许我确实需要这个插件来处理它,当加载手风琴时,性感组合插件也会加载。
最好的问候
李金
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我在对话框中使用 sexyCombo 时发现了类似的问题,因此值得检查将其与手风琴一起使用时是否存在相同的问题。
检查标记后,我意识到当组合在对话框中呈现时,列表的高度被设置为 0。
我向我本地的 sexyCombo 副本添加了一个肮脏的 hack。查看 Javascript 的第 194 行(ish):
this.singleItemHeight = this.listItems.outerHeight();
由于某种原因,outerHeight() 返回 0,所以我只是添加了一个检查来查看 singleItemHeight 是否为 0,如果是,则将其设置为一个合理的值。
I found a similar problem when using the sexyCombo in a dialog, so it would be worth checking whether the same problem exists when using it with an accordion.
After examining the markup I realised that the height of the list was being set to 0 when the combo was rendered in the dialog.
I added a dirty hack to my local copy of sexyCombo. Check out line 194 (ish) of the Javascript:
this.singleItemHeight = this.listItems.outerHeight();
For some reason outerHeight() returns 0, so I just added a check to see if singleItemHeight was 0 and if so set it to a sensible value.