Question

当我尝试使用数组推送将选择选项加载到 optStored 数组时，数组始终保持为空。在chrome，firefox和safari中，代码工作正常但不在Internet Explorer中。有没有解决这个问题或者没有办法解决这个问题？

更新于2016年11月10日上午2:12：对代码进行了一些更改，之前的代码已注释掉，但数组仍然为空！有解决方案吗？

// array to store select options
var optStored = [];

// filter select 
function filterFruits(el) {
  var value = el.value.toLowerCase();
  var form = el.form;
  var opt, sel = form.fruits;
  if (value == "") {
    restoreOpts();
  } else {
    for (var i = sel.options.length - 1; i >= 0; i--) {
      opt = sel.options[i];
      if (opt.text.toLowerCase().indexOf(value) == -1) {
        sel.removeChild(opt);
      }
    }
  }
}

// Restore select options
function restoreOpts() {
  var sel = document.getElementById('fruits');
  sel.options.length = 0;
  for (var i = 0, iLen = optStored.length; i < iLen; i++) {
    // Recent Update 2:12am 10/11/16:
    // Found aworkaround for restoring the select options 
    // This method works with versions of IE4+
    sel.options[sel.options.length] = new Option(optStored[i].text, optStored[i].value, false, false);

    // Recent Comment Update 2:12am 10/11/16: 
    // Console complains of a type mismatch error
    // sel.add(optStored[i], null); 
  }
}

// Load select options
window.onload = function() {
  var sel = document.getElementById('fruits');
  for (var i = 0, iLen = sel.options.length; i < iLen; i++) {
    // Recent Comment Update 2:12am 10/11/16: 
    // tried this method as well but no luck. 
    // it was also mentioned in the comments below
    // the array still remains empty!
    optStored[i] = sel.options[i];

    //optStored.push(sel.options[i]);
  }
};

<form>
  <input type="text" onkeyup="filterFruits(this);" placeholder="Filter">
  <select id="fruits">
    <option value="1">Apple</option>
    <option value="2">Orange</option>
    <option value="3">Cherry</option>
    <option value="4">Banana</option>
  </select>
</form>

Answer 1

根据https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push#Browser_compatibility，IE仅支持版本5.5的push方法。请尝试以下方法：

window.onload = function() {
  var sel = document.getElementById('fruits');
  for (var i = 0, iLen = sel.options.length; i < iLen; i++) {
    optStored[i] = sel.options[i];
  }
};

Answer 2

如果您按F12，它是否在控制台中出现任何错误？ IE控制台远不及Chrome / Firefox开发人员工具，但它应该显示任何错误。

我想知道将using System.Web.Script.Serialization; namespace DemoWebForm { public partial class Default : System.Web.UI.Page { [System.Web.Services.WebMethod] public static string PostJson(string firstName, string lastName) { return new JavaScriptSerializer().Serialize( "Hello, " + lastName + ", " + firstName + "!"); } } }作为第二个参数传递给<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DemoWebForm.Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body ng-app="demoApp"> <form id="form1" runat="server" ng-controller="DemoController"> <pre>{{user}}</pre> <button type="button" onclick="ajaxPostData();">Post Data Ajax</button> <button type="button" ng-click="ngPostData()">Post Data Angular</button> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> <script type="text/javascript"> function ajaxPostData() { var user = { firstName: "John", lastName: "Doe" }; $.ajax({ type: "POST", url: '<%= ResolveUrl("~/default.aspx/postjson") %>', data: JSON.stringify(user), contentType: "application/json", success: function (msg) { console.log(msg.d); } }); } var demoApp = angular.module('demoApp', []) .controller('DemoController', function DemoController($scope, $http) { $scope.user = { "firstName": "John", "lastName": "Doe" }; $scope.ngPostData = function () { $http.post('<%= ResolveUrl("~/default.aspx/postjson") %>', $scope.user) .then(function (result) { console.log(result.data.d); }); } }); </script> </form> </body> </html>方法，根据文档应该undefined将新选项附加到列表的末尾< / p>

before是可选的，并且应该在之前插入表示项目项的集合的元素或类型为long的索引。如果此参数为null（或索引不存在），则新元素将附加到集合的末尾。

https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/add

使用javascript在IE5中使用数组推送不起作用？

2 个答案: