成年人久久,99一区二区,看全黄大色黄大片

導航首頁 ? 技術教程 ? jQuery在ie6下無法設置select選中的解決方法詳解

全站頭部文字我要出現在這里

jQuery在ie6下無法設置select選中的解決方法詳解 749 2024-02-17

本文實例講述了jQuery在ie6下無法設置select選中的解決方法。分享給大家供大家參考，具體如下：

這里主要解決在 ie6 下，jquery 無法設置 select 選中的問題。我們先看個例子：

<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8"/>
  <title>demo</title>
</head>
<body>
  <select name="gameZone" id="gameZone">
    <option value="0">請選擇游戲大區</option>
    <option value="1">游戲一區</option>
    <option value="2">游戲二區</option>
  </select>
</body>
</html>
<script type="text/javascript" src="http://www.gimoo.net/js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
  $.each($('#gameZone > option'),function(){
    if($(this).val() == '1'){
      $(this).attr('selected','selected');
    }
  });
});
</script>

以上代碼在所有瀏覽器中都沒有問題，打開頁面 select 會選中第二個選項。那么當 select 里的內容是動態添加的，又會是怎樣的情況呢？

<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8"/>
  <title>demo</title>
</head>
<body>
  <select name="gameZone" id="gameZone">
    <option value="0">請選擇游戲大區</option>
  </select>
</body>
</html>
<script type="text/javascript" src="http://www.gimoo.net/js/jquery.min.js"></script>
<script type="text/javascript">
var servers ='[{"gm_id":33,"groups":[{"index":"1","name":"u4f20u4e16u51b7u6708","id":"game1"}],"id":"dx1","name":"u7535u4fe1u4e00u533a"},{"gm_id":39,"groups":[{"index":"3","name":"u4ed9u5251u604bu5f71","id":"game3"}],"id":"dx4","name":"u7535u4fe1u4e8c/u4e09/u56db/u4e94/u516du533a"},{"gm_id":49,"groups":[{"index":"1","name":"u7b11u50b2u5343u53e4","id":"game1"}],"id":"dx7","name":"u7535u4fe1u4e03u533a/u516bu533a/u4e5du533a"},{"gm_id":62,"groups":[{"index":"1","name":"u98ceu5f71u76dbu5bb4","id":"game1"}],"id":"dx10","name":"u7535u4fe1u5341u533a"},{"gm_id":68,"groups":[{"index":"1","name":"u70c8u65e5u661fu5b87","id":"game1"},{"index":"3","name":"u5929u67a2u661fu8fb0","id":"game3"},{"index":"5","name":"u7eb5u5730","id":"game5"},{"index":"6","name":"u91d1u83b2","id":"game6"}],"id":"dx11","name":"u7535u4fe1u5341u4e00u533a"}]';
function showZone(){
  var serversLists = eval(servers);
  var serversHtml = '<option value="0">請選擇游戲大區</option>';
  for(var i = 0; i < serversLists.length; i++){
    serversHtml += '<option value="' + serversLists[i].id + '">' + serversLists[i].name + '</option>';
  }
  return serversHtml;
};
$(function(){
  $('#gameZone').html(showZone());
  $.each($('#gameZone > option'),function(){
    if($(this).val() == 'dx1'){
      $(this).attr('selected','selected');
    }
  });
});
</script>

我們可以看到在 chrome，firefox，ie8，ie7 這些瀏覽器都沒有問題，但是在蛋疼的 ie6 瀏覽器中會 js 報錯（無法設置 selected 屬性，未指明的錯誤）。

解決方法有兩種：setTimeout 和 try/catch

第一種：setTimeout（推薦）

<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8"/>
  <title>demo</title>
</head>
<body>
  <select name="gameZone" id="gameZone">
    <option value="0">請選擇游戲大區</option>
  </select>
</body>
</html>
<script type="text/javascript" src="http://www.gimoo.net/js/jquery.min.js"></script>
<script type="text/javascript">
var servers ='[{"gm_id":33,"groups":[{"index":"1","name":"u4f20u4e16u51b7u6708","id":"game1"}],"id":"dx1","name":"u7535u4fe1u4e00u533a"},{"gm_id":39,"groups":[{"index":"3","name":"u4ed9u5251u604bu5f71","id":"game3"}],"id":"dx4","name":"u7535u4fe1u4e8c/u4e09/u56db/u4e94/u516du533a"},{"gm_id":49,"groups":[{"index":"1","name":"u7b11u50b2u5343u53e4","id":"game1"}],"id":"dx7","name":"u7535u4fe1u4e03u533a/u516bu533a/u4e5du533a"},{"gm_id":62,"groups":[{"index":"1","name":"u98ceu5f71u76dbu5bb4","id":"game1"}],"id":"dx10","name":"u7535u4fe1u5341u533a"},{"gm_id":68,"groups":[{"index":"1","name":"u70c8u65e5u661fu5b87","id":"game1"},{"index":"3","name":"u5929u67a2u661fu8fb0","id":"game3"},{"index":"5","name":"u7eb5u5730","id":"game5"},{"index":"6","name":"u91d1u83b2","id":"game6"}],"id":"dx11","name":"u7535u4fe1u5341u4e00u533a"}]';
function showZone(){
  var serversLists = eval(servers);
  var serversHtml = '<option value="0">請選擇游戲大區</option>';
  for(var i = 0; i < serversLists.length; i++){
    serversHtml += '<option value="' + serversLists[i].id + '">' + serversLists[i].name + '</option>';
  }
  return serversHtml;
};
$(function(){
  $('#gameZone').html(showZone());
  setTimeout(function(){
    $.each($('#gameZone > option'),function(){
      if($(this).val() == 'dx1'){
        $(this).attr('selected','selected');
      }
    });
  },1);
});
</script>

第二種：try/catch

<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8"/>
  <title>demo</title>
</head>
<body>
  <select name="gameZone" id="gameZone">
    <option value="0">請選擇游戲大區</option>
  </select>
</body>
</html>
<script type="text/javascript" src="http://www.gimoo.net/js/jquery.min.js"></script>
<script type="text/javascript">
var servers ='[{"gm_id":33,"groups":[{"index":"1","name":"u4f20u4e16u51b7u6708","id":"game1"}],"id":"dx1","name":"u7535u4fe1u4e00u533a"},{"gm_id":39,"groups":[{"index":"3","name":"u4ed9u5251u604bu5f71","id":"game3"}],"id":"dx4","name":"u7535u4fe1u4e8c/u4e09/u56db/u4e94/u516du533a"},{"gm_id":49,"groups":[{"index":"1","name":"u7b11u50b2u5343u53e4","id":"game1"}],"id":"dx7","name":"u7535u4fe1u4e03u533a/u516bu533a/u4e5du533a"},{"gm_id":62,"groups":[{"index":"1","name":"u98ceu5f71u76dbu5bb4","id":"game1"}],"id":"dx10","name":"u7535u4fe1u5341u533a"},{"gm_id":68,"groups":[{"index":"1","name":"u70c8u65e5u661fu5b87","id":"game1"},{"index":"3","name":"u5929u67a2u661fu8fb0","id":"game3"},{"index":"5","name":"u7eb5u5730","id":"game5"},{"index":"6","name":"u91d1u83b2","id":"game6"}],"id":"dx11","name":"u7535u4fe1u5341u4e00u533a"}]';
function showZone(){
  var serversLists = eval(servers);
  var serversHtml = '<option value="0">請選擇游戲大區</option>';
  for(var i = 0; i < serversLists.length; i++){
    serversHtml += '<option value="' + serversLists[i].id + '">' + serversLists[i].name + '</option>';
  }
  return serversHtml;
};
$(function(){
  $('#gameZone').html(showZone());
  try{
    $.each($('#gameZone > option'),function(){
      if($(this).val() == 'dx1'){
        $(this).attr('selected','selected');
      }
    });
  }catch(e){}
});
</script>

更多關于jQuery相關內容感興趣的讀者可查看本站專題：《jQuery錯誤與調試技巧總結》、《jQuery擴展技巧總結》、《jQuery常用插件及用法總結》、《jQuery拖拽特效與技巧總結》、《jQuery表格(table)操作技巧匯總》、《jquery中Ajax用法總結》、《jQuery常見經典特效匯總》、《jQuery動畫與特效用法總結》及《jquery選擇器用法總結》

希望本文所述對大家jQuery程序設計有所幫助。

#免責聲明#

本站[綠夏技術導航]提供的一切軟件、教程和內容信息僅限用于學習和研究目的；不得將上述內容用于商業或者非法用途，否則，一切后果請用戶自負。本站信息來自網絡收集整理，版權爭議與本站無關。您必須在下載后的24個小時之內，從您的電腦或手機中徹底刪除上述內容。如果您喜歡該程序或內容，請支持正版，購買注冊，得到更好的正版服務。我們非常重視版權問題，如有侵權請郵件[admin@lxwl520.com]與我們聯系進行刪除處理。敬請諒解！

文章分類