需要使用鼠标悬停而不是下拉菜单答案

【问题标题】：Need to work with mouse-over instead of dropdown需要使用鼠标悬停而不是下拉菜单
【发布时间】：2016-05-03 10:22:29
【问题描述】：

我们有多个国家/地区的商店视图网站：印度、美国、法国

在网站顶部，我们可以看到这 3 个国家，一旦我们点击下拉按钮here

我们需要的是，而不是点击下拉按钮，它应该与“鼠标悬停”一起工作

app/design/frontend/base/default/template/page/switch/languages.phtml

<?php if(count($this->getStores())>1): ?>
<div class="form-language">
    <label for="select-language"><?php echo $this->__('Your Language:') ?></label>
    <select id="select-language" title="<?php echo $this->__('Your Language') ?>" onchange="window.location.href=this.value">
    <?php foreach ($this->getStores() as $_lang): ?>
        <?php $_selected = ($_lang->getId() == $this->getCurrentStoreId()) ? ' selected="selected"' : '' ?>
        <option value="<?php echo $_lang->getCurrentUrl() ?>"<?php echo $_selected ?>><?php echo $this->escapeHtml($_lang->getName()) ?></option>
    <?php endforeach; ?>
    </select>
</div>
<?php endif; ?>

【问题讨论】：

标签： javascript

【解决方案1】：

你可以使用这个解决方案：

$('select').hover(function() {

  $(this).attr('size', $('option').length);
}, function() {

  $(this).attr('size', 1);
});

它正在使用select 的length 属性。已经在这里回答Trigger click on select box on hover

【讨论】：

我是 JS 新手，请问上述代码中的 function() 是什么？
匿名函数的声明——没有名字的函数。 hover 块中的第一个函数在鼠标进入时执行，第二个函数在鼠标离开时执行

【解决方案2】：

在纯javascript中

document.getElementById("select-language").onmouseover=function(){
  document.getElementById('select-language').click();
};

这个 Jquery 脚本也可以完成这项工作..

$("#select-language").mouseover(function(){
    $( "#select-language" ).trigger( "click" );
});

【讨论】：

我是 JS 新手，请问上述代码中的 function() 是什么？
可以打开它，你需要想出在mouseleave上关闭它的代码
@spylh9999ggr , 参考w3schools.com/js/js_functions.asp 或developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
@VelimirTchatchevsky ，如果他真的需要，他可以编写mouseleave函数，但如果他选择一个选项，它将被关闭。
@sarath 确实如此，但如果你只是打开它并决定不选择任何东西，它就不会关闭 - 你必须点击外面的某个地方，无论如何这是用户体验和 OP 的问题需要它

【解决方案3】：

我认为如果您将 onmouseover 放在选项中，它应该可以工作。

<option onmouseover="window.location.href=this.value" value="<?php echo $_lang->getCurrentUrl() ?>"<?php echo $_selected ?>><?php echo $this->escapeHtml($_lang->getName()) ?></option>

【讨论】：

我是 JS 新手，请问上述代码中的 function() 是什么？
@spylh9999ggr 查看更新的代码，不确定是否可行
@spylh9999ggr 你确实意识到我的意思是你应该用你提供的代码中的行替换这一行对吗？