似乎jQTransform在精简版中没有正确设置SELECT的UL标签高度。高度始终为0,这意味着当您单击以打开它时,选项不可见。我已经尝试强制它在打开时设置高度,但是使用该解决方案,需要6-7次点击才能使其坚持(即没有好处)。有没有人想出如何使它们一起工作?它甚至不适用于默认CSS。其他表单元素似乎工作正常。只是不选择。
我只有几天时间才能到达截止日期,所以我们非常感谢您的帮助。下面是我用来测试的2个文件中非常简单的代码片段。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="includes/shared/js/jquery-latest.js" type="text/javascript"></script>
<link rel="stylesheet" href="includes/shared/js/jqtransformplugin/jqtransform.css" type="text/css" media="all" />
<link rel="stylesheet" href="includes/shared/js/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
<script type="text/javascript" src="includes/shared/js/jqtransformplugin/jquery.jqtransform.js" ></script>
<script type="text/javascript" src="includes/shared/js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
</head>
<body>
<a class="fancybox" href="lightbox.html">Test</a>
<script type="text/javascript">
$('.fancybox').fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 200,
'speedOut' : 200,
'overlayColor' : '#000',
'overlayShow' : true
});
</script>
</body>
</html>
<div id="box" style="min-height: 400px;">
<form id="book_event_form2" method="POST">
<select name="childTickets" class="childTickets" style="width: 50px;">
<option value="0" selected="selected">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>
</form>
</div>
<script type="text/javascript">
jQuery('#book_event_form2').jqTransform();
</script>
答案 0 :(得分:3)
我没有答案,但我遇到了类似的问题。问题似乎是当外部元素设置为“display”none时,甚至“.jqTransformSelectWrapper”的div设置为display:none。
我不知道如何修复输出,但我把它缩小到了那些线上的东西。
我愿意打赌这是插件本身的某种错误。
修改强>
我知道这在技术上并不会解决问题,但它至少可以使其正常工作......
我发现如果我使用CSS来定位UL并给它一个“auto”的高度,它似乎适合我。
只会起作用:
.jqTransformSelectWrapper ul {height: auto;}