触发选择框以在单击另一个元素时下拉 [英] trigger select box to drop down on clicking another element

问题描述

我试图'替换'选择输入上的按钮。我已经查看了jquery中的select替换插件，但它们都是一个有点臃肿的IMO。我想要实现的是一个简单的跨度，位于选择框的下拉按钮上，当它被点击时，选择选项会下降。

I am trying to 'replace' the button on select inputs. I have looked at the select replacement plugins in jquery but they are all a little bloated IMO. What I'd like to achieve is a simple span positioned over the dropdown button of the select box and when it is clicked make the select options drop.

这是我的意思拥有：

$(document).ready(function(){

 $('select').after('<span class="cta arrow-down"></span>');
 $('input[type="submit"]').after('<span class="cta arrow-right"></span>');

 $('span.cta').each(function(){
  var $this = $(this);
  var $prev = $this.prev();
  var $dim = $prev.position();
  $this.css({'top':$dim.top, 'right':0, 'height':$prev.outerHeight(), 'width':$prev.outerHeight()});
  $this.click(function(){
   $prev.trigger('click');
  });
 });

});

我已经尝试了mousedown，并且还使用triggerHandler点击并使用mousedown调用相关的func但无效。 。

I have tried mousedown and also click and mousedown with triggerHandler calling a relevant func but to no avail...

这有可能吗？

推荐答案

你可以'这真的是以跨浏览器的方式做到这一点，主要是因为IE破坏了每个人的乐趣。在IE的早期版本中，< select> 是直接从Windows Forms获取的控件（这就是为什么它有 z-index 和造型问题），很多东西都没有标准化/支持......因为IE无法可靠地完成它。

You can't really do this in a cross-browser way, mainly due to IE ruining the fun for everyone. In early versions of IE the <select> is a control taken directly from Windows Forms (this is why it has z-index and styling issues), so many things aren't standardized/supported...since IE can't reliably do it.

要做你想做的事情在你必须去< select> 替换路线后，臃肿与否......再一次，IE是这些插件甚至存在的主要原因。

To do what you're after you'll have to go the <select> replacement route, bloated or not...once again, IE is the main reason those plugins even exist.

这篇关于触发选择框以在单击另一个元素时下拉的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！