Skip to content

Commit

Permalink
精简 newSetter的逻辑
Browse files Browse the repository at this point in the history
  • Loading branch information
RubyLouvre committed Nov 7, 2014
1 parent 8d481cb commit 34e57f4
Show file tree
Hide file tree
Showing 4 changed files with 406 additions and 292 deletions.
55 changes: 25 additions & 30 deletions avalon.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
http://weibo.com/jslouvre/
Released under the MIT license
avalon 1.3.6 2014.11.5 support IE6+ and other browsers
avalon 1.3.6 2014.11.7 support IE6+ and other browsers
==================================================*/
(function(DOC) {
/*********************************************************************
Expand All @@ -14,7 +14,7 @@
var expose = new Date - 0
var subscribers = "$" + expose
//http://stackoverflow.com/questions/7290086/javascript-use-strict-and-nicks-find-global-function
var window = this || Function("return this")()
var window = this || Function("return this")()
var otherRequire = window.require
var otherDefine = window.define
var stopRepeatAssign = false
Expand Down Expand Up @@ -3377,11 +3377,11 @@
composing = false
}
//当value变化时改变model的值
function updateVModel(e) {
function updateVModel() {
if (composing)//处理中文输入法在minlengh下引发的BUG
return
var val = element.oldValue = element.value //防止递归调用形成死循环
var lastValue = data.pipe(val, data, "get", e)
var lastValue = data.pipe(val, data, "get")
if ($elem.data("duplex-observe") !== false) {
evaluator(lastValue)
callback.call(element, lastValue)
Expand All @@ -3403,9 +3403,9 @@

if (data.isChecked || element.type === "radio") {
var IE6 = !window.XMLHttpRequest
updateVModel = function(e) {
updateVModel = function() {
if ($elem.data("duplex-observe") !== false) {
var lastValue = data.pipe(element.value, data, "get", e)
var lastValue = data.pipe(element.value, data, "get")
evaluator(lastValue)
callback.call(element, lastValue)
}
Expand All @@ -3428,15 +3428,15 @@
}
bound(IE6 ? "mouseup" : "click", updateVModel)
} else if (type === "checkbox") {
updateVModel = function(e) {
updateVModel = function() {
if ($elem.data("duplex-observe") !== false) {
var method = element.checked ? "ensure" : "remove"
var array = evaluator()
if (!Array.isArray(array)) {
log("ms-duplex应用于checkbox上要对应一个数组")
array = [array]
}
avalon.Array[method](array, data.pipe(element.value, data, "get", e))
avalon.Array[method](array, data.pipe(element.value, data, "get"))
callback.call(element, array)
}
}
Expand Down Expand Up @@ -3470,14 +3470,10 @@
bound("cut", delay)
}
} else {//onpropertychange事件无法区分是程序触发还是用户触发
bound("keydown", function(e) {
var key = e.keyCode
if (key === 91 || (15 < key && key < 19) || (37 <= key && key <= 40))
return;
delay(e)
bound("propertychange", function(e) {
if (e.propertyName === "value")
updateVModel()
})
bound("paste", delay)
bound("cut", delay)
}
break
default:
Expand Down Expand Up @@ -3510,14 +3506,15 @@
el.dispatchEvent(event)
}

function onTree() { //disabled状态下改动不触发input事件
if (!this.disabled && this.oldValue !== this.value) {
function onTree(value) { //disabled状态下改动不触发input事件
var newValue = arguments.length ? value : this.value
if (!this.disabled && this.oldValue !== newValue) {
var type = this.getAttribute("data-duplex-event") || "input"
type = type.match(rword).shift()
if (W3C) {
W3CFire(this, "input")
W3CFire(this, type)
} else {
var e = document.createEventObject()
e.isTrusted = false //isTrusted在W3C中表示程序触发
this.fireEvent("onkeydown", e)
this.fireEvent("on" + type)
}
}
}
Expand All @@ -3540,16 +3537,14 @@
}
}

function newSetter(newValue) {
oldSetter.call(this, newValue)
if (newValue !== this.oldValue) {
W3CFire(this, "input")
}
function newSetter(value) {
onSetter.call(this, value)
onTree.call(this, value)
}
try {
var inputProto = HTMLInputElement.prototype
Object.getOwnPropertyNames(inputProto)//故意引发IE6-8等浏览器报错
var oldSetter = Object.getOwnPropertyDescriptor(inputProto, "value").set //屏蔽chrome, safari,opera
var onSetter = Object.getOwnPropertyDescriptor(inputProto, "value").set //屏蔽chrome, safari,opera
Object.defineProperty(inputProto, "value", {
set: newSetter
})
Expand All @@ -3559,15 +3554,15 @@

duplexBinding.SELECT = function(element, evaluator, data) {
var $elem = avalon(element)
function updateVModel(e) {
function updateVModel() {
if ($elem.data("duplex-observe") !== false) {
var val = $elem.val() //字符串或字符串数组
if (Array.isArray(val)) {
val = val.map(function(v) {
return data.pipe(v, data, "get", e)
return data.pipe(v, data, "get")
})
} else {
val = data.pipe(val, data, "get", e)
val = data.pipe(val, data, "get")
}
if (val + "" !== element.oldValue) {
evaluator(val)
Expand Down
39 changes: 19 additions & 20 deletions avalon.modern.js
Original file line number Diff line number Diff line change
Expand Up @@ -2414,7 +2414,6 @@
var params = []
var casting = oneObject("string,number,boolean,checked")
var hasCast
data.error = {}
data.param.replace(/\w+/g, function(name) {
if ((elem.type === "radio" && data.param === "") || (elem.type === "checkbox" && name === "radio")) {
log(elem.type + "控件如果想通过checked属性同步VM,请改用ms-duplex-checked,以后ms-duplex默认是使用value属性同步VM")
Expand Down Expand Up @@ -2730,11 +2729,11 @@
composing = false
}
//当value变化时改变model的值
function updateVModel(e) {
function updateVModel() {
if (composing)//处理中文输入法在minlengh下引发的BUG
return
var val = element.oldValue = element.value //防止递归调用形成死循环
var lastValue = data.pipe(val, data, "get", e)
var lastValue = data.pipe(val, data, "get")
if ($elem.data("duplex-observe") !== false) {
evaluator(lastValue)
callback.call(element, lastValue)
Expand All @@ -2754,9 +2753,9 @@
}
}
if (data.isChecked || element.type === "radio") {
updateVModel = function(e) {
updateVModel = function() {
if ($elem.data("duplex-observe") !== false) {
var lastValue = data.pipe(element.value, data, "get", e)
var lastValue = data.pipe(element.value, data, "get")
evaluator(lastValue)
callback.call(element, lastValue)
}
Expand All @@ -2768,15 +2767,15 @@
}
bound("click", updateVModel)
} else if (type === "checkbox") {
updateVModel = function(e) {
updateVModel = function() {
if ($elem.data("duplex-observe") !== false) {
var method = element.checked ? "ensure" : "remove"
var array = evaluator()
if (!Array.isArray(array)) {
log("ms-duplex应用于checkbox上要对应一个数组")
array = [array]
}
avalon.Array[method](array, data.pipe(element.value, data, "get", e))
avalon.Array[method](array, data.pipe(element.value, data, "get"))
callback.call(element, array)
}
}
Expand Down Expand Up @@ -2821,16 +2820,18 @@
function W3CFire(el, name, detail) {
var event = DOC.createEvent("Events")
event.initEvent(name, true, true)
event.isTrusted = false
if (detail) {
event.detail = detail
}
el.dispatchEvent(event)
}

function onTree() { //disabled状态下改动不触发inout事件
if (!this.disabled && this.oldValue !== this.value) {
W3CFire(this, "input")
function onTree(value) { //disabled状态下改动不触发inout事件
var newValue = arguments.length ? value : this.value
if (!this.disabled && this.oldValue !== newValue) {
var type = this.getAttribute("data-duplex-event") || "input"
type = type.match(rword).shift()
W3CFire(this, type)
}
}
avalon.tick = function(fn) {
Expand All @@ -2850,15 +2851,13 @@
}
}

function newSetter(newValue) {
oldSetter.call(this, newValue)
if (newValue !== this.oldValue) {
W3CFire(this, "input")
}
function newSetter(value) {
onSetter.call(this, value)
onTree.call(this, value)
}
try {
var inputProto = HTMLInputElement.prototype
var oldSetter = Object.getOwnPropertyDescriptor(inputProto, "value").set //屏蔽chrome, safari,opera
var onSetter = Object.getOwnPropertyDescriptor(inputProto, "value").set //屏蔽chrome, safari,opera
Object.defineProperty(inputProto, "value", {
set: newSetter,
configurable: true
Expand All @@ -2869,15 +2868,15 @@

duplexBinding.SELECT = function(element, evaluator, data) {
var $elem = avalon(element)
function updateVModel(e) {
function updateVModel() {
if ($elem.data("duplex-observe") !== false) {
var val = $elem.val() //字符串或字符串数组
if (Array.isArray(val)) {
val = val.map(function(v) {
return data.pipe(v, data, "get", e)
return data.pipe(v, data, "get")
})
} else {
val = data.pipe(val, data, "get", e)
val = data.pipe(val, data, "get")
}
if (val + "" !== element.oldValue) {
evaluator(val)
Expand Down
Loading

0 comments on commit 34e57f4

Please sign in to comment.