Question

我很新，并且遇到了以下问题...

案例：

我们有手风琴，在这个手风琴中我们有一个性感的组合框

    <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（）;导致性感的组合工作

可能的原因： - 手风琴在性感的组合对象之前开始......毕竟性感的组合对象没有被加载或者手风琴对象的某种“隐藏”

有人知道这种行为的原因是什么吗？或者如何修复它？

在这里阅读了一些主题后，我找到了smth。就像一个jQuery live插件，也许我确实需要这个插件来处理它，当加载手风琴时，性感的组合插件也会加载。

最好的问候

leejin

Answer 1

在对话框中使用sexyCombo时发现了类似的问题，因此在使用手风琴时检查是否存在同样的问题是值得的。

检查标记后，我意识到在对话框中渲染组合时，列表的高度设置为0.

我在本地的sexyCombo副本中添加了一个肮脏的黑客。查看Javascript的第194行（ish）：

this.singleItemHeight = this.listItems.outerHeight（）;

由于某种原因，outerHeight（）返回0，所以我只是添加了一个检查以查看singleItemHeight是否为0，如果是，则将其设置为合理的值。

使用手风琴和“性感组合”插件

1 个答案: