2013-04-03 79 views
0

我阅读文章Dropdownlist width in IE,但不幸的是我无法适应它以满足我的需求。IE中选择列表的宽度

我有一些在新窗口中打开网址选项的选择列表,我使用下面的jQuery的:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

用于连接选择列表的选项的脚本如下:

<script type="text/javascript"> 
    $(document).ready(function() { 
    $('.openSelect').change(function(){ 
    var selectedValue=$(this).val(); 
     if (selectedValue.match(/http/)) { 
     var open = window.open($(this).val(),'_blank'); 
     if (open == null || typeof(open)=='undefined'){ 
     alert("Please turn off pop-up blocker and reload this page to visit: " + selectedValue); 
     } 
} 
}); 
}); 
</script> 

我的问题是,下拉菜单的宽度受IE6,7和8中表格单元宽度的限制,所以我必须修正它以扩展到最长选项内容的宽度。 唯一的限制是我必须保留上面的脚本并以某种方式修改它,而不是完全改变它。

选择列表中的一个例子如下页给出: http://www.myairlease.com/available/available_for_lease_737

回答

0

你的问题是,IE8和早期用来HTML选择框操作系统内置的下拉框控件。所有其他浏览器(包括IE9和更高版本)都会自行显示选择框,但IE6/7/8不显示。

这带来了一些怪癖和限制,你看到的效果是最明显的。

简短的回答是,IE8和更早版本中没有办法强制标准选择框显示比选择框本身更宽的字符串。有一些黑客的解决方法,但它们并不是很好,特别是当你处理基于表格的布局时。

较长的答案是,如果您需要这样做,那么您唯一的选择是使用自定义选择框控件。有许多jQuery插件会覆盖默认选择框。有很多可供选择的东西,而且它们有各种不同的功能,所以我不会推荐一个特定的功能,我会引导你到this site,其中列出了十个最好的。这是一个相当不错的选择,至少其中一些人会以你需要的方式工作。

一般而言,它们使用起来非常简单,并且不会对HTML代码进行任何更改;只需在文档就绪功能中添加一点额外的javascript即可激活它们。

我希望有帮助。

0

感谢您的帮助!

我试过使用LinkSelect插件,但我确实做错了什么。 http://www.givainc.com/labs/linkselect_jquery_plugin.htm#options

我选择标签以下

<select class="openSelect" style="width:px; color:#0066ff;"> 

所以我简单地装载在头部以下:

<script type="text/javascript" src="js/jquery.linkselect.min.js"></script> 
<script type="text/javascript" src="js/jquery.bgiframe.js"></script> 
<link type="text/css" href="css/jquery.linkselect.css" rel="stylesheet" media="all" /> 

,改变我的脚本如下??

<script type="text/javascript"> 
$(document).ready(function() { 
$('.select.openSelect').openSelect(); 
    $('.openSelect').change(function(){ 
    var selectedValue=$(this).val(); 
    if (selectedValue.match(/http/)) { 
     var open = window.open($(this).val(),'_blank'); 
     if (open == null || typeof(open)=='undefined'){ 
     alert("Please turn off pop-up blocker and reload this page to visit: " + selectedValue); 
     } 
    } 
    }); 
}); 
</script> 

我尝试过了,这是行不通的,所以任何想法在我的错误是?

感谢

0

我看了一下,其中插塞描述和他们使用的是他们中的说明给什么完全不同的页面的源代码.....

任何机会有人可以帮助如何进行?

谢谢