资源管理器不遵循 jquery 下的下拉列表选项链接

发布于 2024-09-08 01:21:20 字数 1586 浏览 0 评论 0原文

此列表中的第一个新成员。请原谅任何失礼行为...

这是 html...(Q1..不确定所选选项的语法,但这似乎有效...)

<select>
<option class=" " value="choose" selected="yes" SELECTED>choose language</option>
<option class=" turnoffbuttonenglish" value="japanese" >日本語 </option>
<option class=" turnoffbuttonjapanese" value="english" >English </option>
<option class="turnonboth" value="both" >both </option>
</select>

每个选项选择在页面和 iframe 中显示的语言。

这是 jquery 似乎不起作用(我认为问题出在这里,而不是我的代码中的其他地方......)

这三个选项有类似的代码部分。但下面是关掉按钮日语类的示例。 (名称是遗产,它确实显示英语..隐藏的类不显示...

 $('.turnoffbuttonjapanese').click( function() {
$currentLanguage ="2" 
$('.japanese').addClass("hidden"); 
$('.english').removeClass("hidden");
$currentIFrame.contents().find(".japanese").each(function(index, item) {
 $(item).addClass("hidden"); 
});
$currentIFrame.contents().find(".english").each(function(index, item) {
 $(item).removeClass("hidden"); 
});
});

这似乎在歌剧中有效,但在资源管理器中无效!!??? 当我选择时什么也不会发生。

如果我有

   <div class=" english hidden turnoffbuttonenglish"> <a
  class=" turnoffenglish" title="see 日本語 page">日本語&nbsp;<img
  src="images/chopsticks150.png" height="100%" alt="chopsticks"> </a></div>

<div class=" japanese turnoffbuttonjapanese"><a
  class=" turnoffjapanese" title="see ENGLISH page">English&nbsp;<img
  src="images/knifeandfork150.png" height="100%" alt="knife and fork"></a>    </div>

这个作品......???

1st new to this list. please pardon any faux pas....

this is the html... (Q1..not sure of syntax for selected option but this seems to work...)

<select>
<option class=" " value="choose" selected="yes" SELECTED>choose language</option>
<option class=" turnoffbuttonenglish" value="japanese" >日本語 </option>
<option class=" turnoffbuttonjapanese" value="english" >English </option>
<option class="turnonboth" value="both" >both </option>
</select>

each option chooses which language to display in the page and an iframe.

here is the jquery that seems not to be working (I think the problem is here and not elsewhere in my code...)

there are analogous sections of code for the three options. but below is the exammple for class turnoffbuttonjapanese. (name is legacy, it really shows english..class hidden displays none...

 $('.turnoffbuttonjapanese').click( function() {
$currentLanguage ="2" 
$('.japanese').addClass("hidden"); 
$('.english').removeClass("hidden");
$currentIFrame.contents().find(".japanese").each(function(index, item) {
 $(item).addClass("hidden"); 
});
$currentIFrame.contents().find(".english").each(function(index, item) {
 $(item).removeClass("hidden"); 
});
});

This seems to work in opera, but not in explorer!!???
when I select nothing happens.

If instead I have

   <div class=" english hidden turnoffbuttonenglish"> <a
  class=" turnoffenglish" title="see 日本語 page">日本語 <img
  src="images/chopsticks150.png" height="100%" alt="chopsticks"> </a></div>

<div class=" japanese turnoffbuttonjapanese"><a
  class=" turnoffjapanese" title="see ENGLISH page">English <img
  src="images/knifeandfork150.png" height="100%" alt="knife and fork"></a>    </div>

this works...???

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

﹏半生如梦愿梦如真 2024-09-15 01:21:20

不要依赖 click 事件(如您所见,它不能跨浏览器工作),而是按值(并且如果可能的话,给

$('#mySelectID').change(function() {
  if($(this).val() == "english") {
    $currentLanguage = "2";
    $('.japanese').addClass("hidden"); 
    $('.english').removeClass("hidden");
    $currentIFrame.contents().find(".japanese").addClass("hidden");
    $currentIFrame.contents().find(".english").removeClass("hidden");
  }
});

第一个

您也可以稍微重新处理一下,不确定您的总体意图,例如您可以隐藏所有其中,然后显示您选择的值,而不是每个选项的 if,从而使您的代码更短。

Instead of relying on the click event of an <option> (which won't work cross-browser as you're seeing), instead go by the value (and if possible, give that <select> an ID to make it cleaner), like this:

$('#mySelectID').change(function() {
  if($(this).val() == "english") {
    $currentLanguage = "2";
    $('.japanese').addClass("hidden"); 
    $('.english').removeClass("hidden");
    $currentIFrame.contents().find(".japanese").addClass("hidden");
    $currentIFrame.contents().find(".english").removeClass("hidden");
  }
});

The reason the first <select> version isn't working is because not all browsers even fire that click event on an <option>, so your code never gets to run. Taking this approach will work and be more cross-browser stable. If you want an immediate effect on browsers that don't fire change until blur occurs, you can run it a bit more often using .bind(), just replace .change(function() { with .bind('change click', function() {.

You can also re-work this a bit, not sure of your overall intentions, for example you can hide all of them, then show the value your selected, instead of an if for each option, making your code much shorter.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文