javascript - 在 Ember.js 应用程序中实现 jQuery

Question

我要求对 Ember.js 创建的应用程序进行周转，但我对此没有太多经验。我已删除/添加了字段，添加了必要的文本，最后要做的任务是验证字段(电话号码)以确保它们相同。它可以在我的本地主机上运行，​​但不能在 Ember 应用程序上运行。

这是 Ember.js

data.buffer.push("\n      </div>\n    </div>\n\n    <div class=\"form-

row\">\n      <div class=\"field w100\">\n        <label for=\"primary_phone\">Primary phone (digits only) *</label>\n        ");
  hashContexts = {'type': depth0,'name': depth0,'required': depth0,'placeholder': depth0,'title': depth0};
  hashTypes = {'type': "STRING",'name': "STRING",'required': "STRING",'placeholder': "STRING",'title': "STRING"};
  options = {hash:{
    'type': ("number"),
    'name': ("primary_phone"),
    'required': ("required"),
    'placeholder': ("e.g. 12025556789 (country code + area code + local number without dashes)"),
    'title': ("e.g. 12025556789 (country code + area code + local number without dashes)")
  },contexts:[],types:[],hashContexts:hashContexts,hashTypes:hashTypes,data:data};
  data.buffer.push(escapeExpression(((stack1 = helpers.input || depth0.input),stack1 ? stack1.call(depth0, options) : helperMissing.call(depth0, "input", options))));

   data.buffer.push("\n      </div>\n    </div>\n\n    <div class=\"form-row\">\n      <div class=\"field w100\">\n        <label for=\"confirm_phone\">Confirm Primary phone (digits only) *</label>\n        ");
  hashContexts = {'type': depth0,'name': depth0,'required': depth0,'placeholder': depth0,'title': depth0};
  hashTypes = {'type': "STRING",'name': "STRING",'required': "STRING",'placeholder': "STRING",'title': "STRING"};
  options = {hash:{
    'type': ("number"),
    'name': ("confirm_phone"),
    'required': ("required"),
    'placeholder': ("e.g. 12025556789 (country code + area code + local number without dashes)"),
    'title': ("e.g. 12025556789 (country code + area code + local number without dashes)")
  },contexts:[],types:[],hashContexts:hashContexts,hashTypes:hashTypes,data:data};
  data.buffer.push(escapeExpression(((stack1 = helpers.input || depth0.input),stack1 ? stack1.call(depth0, options) : helperMissing.call(depth0, "input", options))));

这是我的 jQuery

$(function(){
var $primaryNo = $("input[name='primary_phone']");
var $confirmNo = $("input[name='confirm_phone']");
var $btn = $('#button');

$primaryNo.keypress(function(key) {
    if(key.charCode < 48 || key.charCode > 57) 
    return false;
});

$confirmNo.keypress(function(key) {
    if(key.charCode < 48 || key.charCode > 57) 
    return false;
});

$btn.click(function() {
     if ($primaryNo.val() !== $confirmNo.val()) {
        alert('The numbers from the Primary Phone field and the Confirm Primary Phone field do not match. Please re-enter');
     } else {
        return true;
     }

});

});

我已经使用 console.log 进行了一些测试，并且 Ember 应用程序正在获取我包含的 .js 文件，但是当我在两个不同的数字插入到字段中时单击“提交”时，它不会提醒用户它们是不正确的。

有什么想法吗？

Answer 1

尝试事件委托(delegate):

$(function(){
var $primaryNo = $("input[name='primary_phone']");
var $confirmNo = $("input[name='confirm_phone']");
var $btn = $('#button');

$('body').on('keypress',$primaryNo,function(key) {
    if(key.keyCode < 48 || key.keyCode > 57) 
    return false;
});

$('body').on('keypress',$confirmNo,function(key) {
    if(key.keyCode < 48 || key.keyCode > 57) 
    return false;
});

$('body').on('click',$btn,function(e) {
     e.preventDefault();
     if ($primaryNo.val() !== $confirmNo.val()) {
        alert('The numbers from the Primary Phone field and the Confirm Primary Phone field do not match. Please re-enter');
     } else {
       $(this).closest('form').submit();
     }

});

});