出错：对象不支持属性或方法“assign”。

Question

我在我的WordPress网站上使用了这个jquery弹出插件从这个链接。它在所有浏览器上都可以正常工作，但在IE11上报以下错误。

- pragya rai

---

@JohnDoe，你能提供一个可行的例子吗？ - Dekel

@pragya，请放上你的一些代码，这样我们才能判断问题出在哪里…可能是dom元素找不到的问题，或者页面上有相同id的多个元素。 - Haresh Vidja

Answer 1

如其他人所提到的，Object.assign() 方法不支持 IE 浏览器，但是有一个 polyfill 可用，只需在插件声明“之前”包含它：

if (typeof Object.assign != 'function') {
  Object.assign = function(target) {
    'use strict';
    if (target == null) {
      throw new TypeError('Cannot convert undefined or null to object');
    }

    target = Object(target);
    for (var index = 1; index < arguments.length; index++) {
      var source = arguments[index];
      if (source != null) {
        for (var key in source) {
          if (Object.prototype.hasOwnProperty.call(source, key)) {
            target[key] = source[key];
          }
        }
      }
    }
    return target;
  };
}

来源于https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

测试页面：http://jsbin.com/pimixel/edit?html,js,output（只需删除 polyfill 即可获得与您的页面相同的错误）。

- Andres Ilich

---

为什么要使用单个!=而不是更安全的!==？ - Daniel Kucal

谢谢！这很好地解决了问题。我在使用Facebook客户聊天小部件时遇到了完全相同的问题，将此代码应用于FB代码之前就解决了问题。（对于仍然坚持使用IE的一个客户端，尽管其他人已经转向现代浏览器） - Alex Russell

类似的东西在这里可以找到 https://www.npmjs.com/package/es6-object-assign -- 我通过npm install添加了它...并按照建议复制了自动填充代码 <script src="<your-libs-directory>/object-assign-auto.min.js"></script> - user3456014

Answer 2

@John Doe

从你的评论中我得知你想在node/react技术栈中实现这个功能。这与原来的问题非常不同，你应该问自己的问题；)
无论如何，以下是你需要做的...

你可以使用[es6-object-assign][1]。它是一个ES6 Object.assign()“polyfill”。

首先，在你的根目录下的package.json文件中，将es6-object-assign添加为依赖项：

"dependencies": {
    "es6-object-assign": "^1.0.2",
    "react": "^0.12.0",
    ...
  },

如果您希望在Node环境中使用它，请使用：

require('es6-object-assign').polyfill();

如果您在前端（浏览器）遇到问题...将其添加到您的index.html文件中...

<script src="location_of_node_modules/es6-object-assign/dist/object-assign.min.js"></script>
<script>
  window.ObjectAssign.polyfill();
</script>

location_of_node_modules 取决于你使用的模板，大多数情况下只是 node_modules，但有时当 index.html 在子目录中时，你需要使用 ../node_modules

- shramee

Answer 3

根据文档，Object.assign() 是 ECMAScript 2015 (ES6) 标准的新技术：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign。但不支持 IE 浏览器。

- JGV

---

你如何在一个 node/react 技术栈中实现像 https://www.npmjs.com/package/event-source-polyfill 这个 polyfill 呢？ - John Doe

Answer 4

这个问题的一个可能解决方案是：

在 custombox.min.js 之前添加脚本 legacy.min.js

来源：custombox Github 项目

- aprovent

Answer 5

目前我正在自己开发一个jQuery弹出窗口： https://github.com/seahorsepip/jPopup

它拥有您所期望的所有弹出窗口的功能，甚至更多 :D

无论如何，回到主题，我目前正在编写第二版，这是一个大的改写，并增加了对IE6（版本1仅支持IE7+）的支持，而且遇到了类似的错误...

在IE6中导致错误的原始代码：

//Insane code for an insane browser
this._vars.fakeScrollbar = $("<div style=\"position:absolute;top:expression(document.documentElement.scrollTop);right:0;bottom:0;margin-left:-200px;width:0;overflow-y:scroll;height:expression(document.documentElement.clientHeight);z-index:9999999;\"></div>");

我想到的解决办法是：

//Insane code for an insane browser
this._vars.fakeScrollbar = $("<div>");
this._vars.fakeScrollbar.html("<div style=\"position:absolute;top:expression(document.documentElement.scrollTop);right:0;bottom:0;margin-left:-200px;width:0;overflow-y:scroll;height:expression(document.documentElement.clientHeight);z-index:9999999;\"></div>");
this._vars.fakeScrollbar = this._vars.fakeScrollbar.children();

- seahorsepip

Answer 6

请添加脚本。

<script src="https://cdn.jsdelivr.net/npm/es6-object-assign@1.1.0/dist/object-assign-auto.min.js"></script>

将HTML文件添加到解决此问题的文件中。

- HoangDo

---

在我的Laravel ReactJS应用程序上完美运行，谢谢伙计 :) - Omer

Answer 7

@Andres-Ilich已经回答了你的问题，但是你问的是错误的问题：

为什么不直接使用支持IE的jQuery插件，比如Zurb优秀的Reveal插件：https://github.com/zurb/reveal？

它会满足你的所有需求，而且不会出现这个错误。

- serraosays

Answer 8

由于您在问题中标记了jQuery，因此可以使用jQuery的extend函数。无需使用polyfill，并且它还可以进行深度合并。

例如：

var object1 = {
  apple: 0,
  banana: { weight: 52, price: 100 },
  cherry: 97
};
var object2 = {
  banana: { price: 200 },
  durian: 100
};

// Merge object2 into object1
$.extend( object1, object2 );

结果：

{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}

- Kalimah

Answer 9

通常情况下，当某个HTML元素ID与JavaScript函数中的某个变量具有相同的ID时，就会出现这些错误。更改其中一个名称后，代码运行正常。

来源：SCRIPT438：Object doesn't support property or method IE 其他链接：jQuery验证IE对象不支持属性

- Milap

Answer 10

基本上，Object.assign 不被所有浏览器支持，但是在当前浏览器不支持它的情况下，可以在 Object 上重新分配它。

最好的解决方案是在目标后迭代每个参数，将 arguments 对象的每个属性分配给 target，考虑对象和数组之间的迭代，以避免创建引用。 可选地，为了不失去实例，您可以检测属性的最后一个实例是否仅等于 "Array" 或 "Object"，这样做就不会丢失 Image 接口（例如），如果您计划创建新引用，则具有这些实例的对象仍将是引用。 编辑：原始的 Object.assign 不是以这种方式工作的。

根据这个解决方案，我有自己的 polyfill，可以在 这里 找到。

- user5066707