0

我正在尝试构建一个自定义 date.js 函数（与引导程序配对）将响应每个输入......

如果我说，我的函数适用于一系列字段中的第一项$(".date-js").changeIt();，但仅适用于第一项。

$.fn.changeIt = function() {
    var input = "input#" + $(this).attr('id');
    input = $(input).data('val', $(input).val()); // save value
    $(input).change(function() { // works when input will be blured and the value was changed
        date = Date.parse(input.val());

        if (date !== null) {
            input.removeClass();
            input.parent().removeClass("error success");
            input.parent().addClass("success");
            input.addClass("success");
        } else {
            input.removeClass();
            input.parent().removeClass("error success");
            input.addClass("field_with_errors");
            input.parent().addClass("error");
        }
    });

    $(input).keyup(function() { // works immediately when user press button inside of the input
        if ($(input).val() != $(input).data('val')) { // check if value changed
            $(input).data('val', $(input).val()); // save new value
            $(this).change(); // simulate "change" event
        }
    });
}

= form_for [@tool, @calibration] do |f|
  #errors
  .form-container
    -if @tool.status == "In"
      %p Enter time taken for calibration
      .field.control-group
        = f.label :ats_in
        = f.text_field :ats_in, :class => "date-js"
    -if @tool.status == "Out"
      %p Enter time returned
      .field.control-group
        = f.label :cal_date
        = f.text_field :cal_date, :class => "date-js"
      .field.control-group
        = f.label :cal_date_due
        = f.text_field :cal_date_due, :class => "date-js"
      .field.control-group
        = f.label :ats_out
        = f.text_field :ats_out, :class => "date-js"
  .clear
  = f.submit 'Save', :disable_with => "Saving..."
4

1 回答 1

0

包装你的插件代码，return this.each(function () { });然后它将应用于所有匹配的元素。更新代码：

$.fn.changeIt = function() {
    return this.each(function() {
        var input = "input#" + $(this).attr('id');
        input = $(input).data('val', $(input).val()); // save value
        $(input).change(function() { // works when input will be blured and the value was changed
            date = Date.parse(input.val());
            if (date !== null) {
                input.removeClass();
                input.parent().removeClass("error success");
                input.parent().addClass("success");
                input.addClass("success");
            } else {
                input.removeClass();
                input.parent().removeClass("error success");
                input.addClass("field_with_errors");
                input.parent().addClass("error");
            }
        });

        $(input).keyup(function() { // works immediately when user press button inside of the input
            if ($(input).val() != $(input).data('val')) { // check if value changed
                $(input).data('val', $(input).val()); // save new value
                $(this).change(); // simulate "change" event
            }
        });
    });
}
于 2013-07-09T19:00:00.290 回答