如何将选项对象作为参数传递给jQuery（）的第二个参数的方法集？

在jQuery（） ：

要点：如果传递第二个参数，则第一个参数中的HTML字符串必须表示没有属性的简单元素。 从jQuery 1.4开始 ，可以传入任何事件类型 ，并且可以调用以下jQuery方法： val ， css ， html ， text ， data ， width ， height或offset 。

从jQuery 1.8开始 ， 任何 （强调添加）jQuery实例方法（jQuery.fn的方法）都可以用作传递给第二个参数的对象的属性：

---

将animate作为属性传递时，该元素似乎立即设置css属性

 var div = $("
", { id: "foo", "class": "a", animate: { fontSize:"22px" }, data: { fontSize: "12px" }, text: "click", on: { "click": function(e) { $(this).css($(this).data()) } } }); $("body").append(div); 

尝试以两种方式animate的duration

  animate: {fontSize:"22px", duration:5000} 

似乎没有识别duration属性，和

  animate: {fontSize:"22px", {duration:5000}} 

记录Uncaught SyntaxError: Unexpected token { error to console 。

设置css:{transition: font-size 5s}确实会返回预期的结果

 var div = $("
", { id: "foo", "class": "a", animate: { fontSize:"22px"}, data: { fontSize: "12px" }, css:{ transition: "font-size 5s" }, text: "click", on: { "click": function(e) { $(this).css($(this).data()) } } }); $("body").append(div); 

应该可以直接将options对象传递给animate方法。

题：

如何将其他属性传递给animate或其他接受多个对象属性作为参数的jQuery方法; 例如，在jQuery()第二个参数中定义的.animate()方法的duration或step ？

Answer 1

animate方法的默认持续时间为400毫秒。 如果你运行你发布的第一个片段，你会看到CSS在那么短的时间内（0.4秒）被动画化了。

但是持续时间的特定值只能通过第二个参数传递给所有可用的jQuery方法签名中的动画 。

jQuery不支持将多个参数传递给在作为第二个参数传递给jQuery（）的普通对象中指定为属性的函数。

从第2912行附近的jQuery v1.12.0源代码片段可以看出这一点：

 // HANDLE: $(html, props) if ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) { for ( match in context ) { // Properties of context are called as methods if possible if ( jQuery.isFunction( this[ match ] ) ) { this[ match ]( context[ match ] ); // <------------- // ...and otherwise set as attributes } else { this.attr( match, context[ match ] ); } } } 

因此，没有办法以这种方式将持续时间传递给.animate ，因此 - 在.animate的情况下 - 默认持续时间为400毫秒 。

解决方法1：覆盖默认值

当然可以选择将默认持续时间更改为所需的持续时间，并在$(html, plainobject)调用之后立即恢复：

 $.fx.speeds._default = 5000; // change default var div = $("
", { animate: { fontSize:"100px", }, text: "animated text", }); $.fx.speeds._default = 400; // restore; $("body").append(div);