幻灯片事件和基因敲除JS

我有一个bindingHandler像这样：幻灯片事件和基因敲除JS

ko.bindingHandlers.percentageSlider = { 
init: function (element, valueAccessor, allBindingsAccessor) { 
    var options = allBindingsAccessor().percentageSliderOptions || {}; 
    $(element).slider(options); 
    ko.utils.registerEventHandler(element, "slidechange", function() { 
     var observable = valueAccessor(); 
     observable($(element).slider("value")); 
    }); 
    ko.utils.domNodeDisposal.addDisposeCallback(element, function() { 
     $(element).slider("destroy"); 
    }); 
    ko.utils.registerEventHandler(element, "slide", function() { 
     var observable = valueAccessor(); 
     observable($(element).slider("value")); 
    }); 
}, 
update: function (element, valueAccessor) { 
    var value = lo.unwrap(valueAccessor()); 
    $(element).slider("value", value); 

} 
};

和模板结合，像这样的滑块：

<tr> 
    <td class="caption-cell">@Translate("EditProbability")</td> 
    <td width="75%"> 
     <div style="float:left;" data-bind="percentageSlider: probability, percentageSliderOptions: {min: 0, max: 100, range: 'min', step: 10}"></div> 
     <div style="float:left;margin:0 0 0 10px" data-bind="dynamicText: function(){ return probability() + '%'; }"></div> 
    </td> 
</tr>

处理程序dynamicText看起来是这样的：

ko.bindingHandlers.dynamicText = { 
'update': function (element, valueAccessor) { 
    var value = lo.unwrap(valueAccessor()); 
    if (typeof value === 'function') { 
     value = value(element); 
    } 
    if ((value === null) || (value === undefined)) { 
     value = ""; 
    } 
    if (typeof element.innerText == "string") { element.innerText = value; } 
    else { element.textContent = value; } 
} 
};

现在我的问题是，滑块有不规则的行为，有时我不能达到100％，有时值是一个政变几十远离它应该是什么。如果我只点击一次滑块，它就会一直到正确的位置。我想在滑动滑块时更新百分比，并且我还希望滑块通过淘汰赛（使用更新事件）正确更新。我应该采取什么方法？谢谢阅读。

来源

2012-03-01 Phil

你就可以将它挂在的jsfiddle或东西，使我们可以看一看？ – farina 2012-03-02 00:12:11

这里是一个工作的jsfiddle：http://jsfiddle.net/jearles/yumLr/

你的问题是，你需要使用：ui.value获得在幻灯片和slidechange事件处理程序更新的句柄值。请注意更改的事件处理程序签名。

来源

2012-03-02 13:08:16

哇，谢谢！我试了一下，它的工作。真的有帮助！ – Phil 2012-03-02 14:04:01

约翰斯，解决方案非常好，我只是发布这个，因为我不相信它实际上解决了原来的问题。

我认为实际问题是价值在更新功能中被拉动的方式。该行：

var value = lo.unwrap(valueAccessor());

是错误的。如果我更新该行：

var value = ko.utils.unwrapObservable(valueAccessor());

无论是原来的解决方案，而不利用事件和UI参数和建议的解决方案似乎是相同的功能。

参考：http://jsfiddle.net/JTY8v/4/

来源

2012-10-05 08:22:25 mdeangelo272

幻灯片事件和基因敲除JS

回答

相关问题