Question

如何将下面的jquery代码转换为原型？

<script> 
    $(document).ready (function() {
        $("#valor").keyup(function(){
            var resultVal = 0.0;
            var objRegExp = '\s+';
            $("#valor").each ( function() {
                resultVal += parseFloat ( $j(this).val().replace(/\s/g,'').replace(',','.'));
            });
            $("#total").val(resultVal);  
        });
    });
</script>

感谢。

Answer 1

我不知道，但纯JavaScript总是很好看：

function doLoad() {
     var valor = document.getElementById("valor");
     valor.onkeyup = function() {
          var resultVal = 0.0;
          var objRegExp = '\s+';
          for(var i = 0; i < valor.childNodes.length; i++) {
               var n = valor.childNodes[i];
               if(n.nodeType === 1) resultVal += parseFloat(n.value.replace(/\s/g, '').replace(',', '.'));
          }
          document.getElementById("total").value = resultVal.toString();
     };
}

if(window.addEventListener)
     window.addEventListener("load", doLoad, false);
else
     window.attachEvent("onload", doLoad);

Answer 2

以下是迁移的实例：

http://jsfiddle.net/MaQA5/

代码：

eventObserver = function() {
    var resultVal = 0.0;
    var objRegExp = '\s+';
    $$(".valor").each(function(el) {
        resultVal += parseFloat($(el).getValue().replace(/\s/g, '').replace(',', '.'));
    });
    $("total").setValue(resultVal);
};

$$('.valor').each(function(el) {
    el.observe('keyup', eventObserver);
});

一些评论：

从您的代码中，我猜您有几个输入具有相同的id（valor）。如果是这种情况，那就错了，因为ID在整个DOM中必须是唯一的。

这就是为什么我为名为class的{{1}}更改了此内容。

Prototype有一个特殊的valor函数来通过css-selector获取元素。但是使用$$进行id搜索或将DOM元素转换为Prototype-enabled元素。

调用$方法时，不必使用each作为原始集合中的每个元素（就像在jQuery中一样），必须使用函数中的第一个参数：{{1} }。

您必须使用this。

，而不是调用el jQuery方法

在我看来，jQuery更优雅，或者至少，我知道的Prototype并不那么花哨：）

Jquery到Prototype

2 个答案:

代码：

一些评论：