Javascript 如何使用jqueryaddnumber_field_tag';s值

Javascript 如何使用jqueryaddnumber_field_tag';s值,javascript,jquery,ruby-on-rails,ruby-on-rails-3,ruby-on-rails-4,Javascript,Jquery,Ruby On Rails,Ruby On Rails 3,Ruby On Rails 4,很抱歉,我不熟悉在Rails中使用Javascript 我有4个数字\字段\标签。 每当用户输入一个数字时,它会将所有4个数字\字段\标签的数字相加。我想知道我该怎么做 我已经试过了,但是我不知道如何调用这个函数 <td class="method2"> <p>Input the number of each base the primer should have</p> <label>

很抱歉,我不熟悉在Rails中使用Javascript

我有4个数字\字段\标签。 每当用户输入一个数字时,它会将所有4个数字\字段\标签的数字相加。我想知道我该怎么做

我已经试过了,但是我不知道如何调用这个函数

<td class="method2">
                <p>Input the number of each base the primer should have</p>
                <label>Number of A :</label>
                <%= number_field_tag(:no_A,nil, in:0...36) %><br />
                <label>Number of T :</label>
                <%= number_field_tag(:no_T,nil, in:0...36) %><br />
                <label>Number of G :</label>
                <%= number_field_tag(:no_G,nil, in:0...36) %><br />
                <label>Number of C :</label>
                <%= number_field_tag(:no_C,nil, in:0...36) %><br />
                Total bases:<span></span>
</td>   

输入底漆应具有的每个基底的编号

A的数量:
T的数量:
G的数量:
C的数量:
总基数:

如何显示当前的总基数

如果我正确理解了您的问题,您有4个有基数的东西,您希望在用户在“数字”字段中输入信息时动态向用户显示总共有基数。为了实现这一点,我获取了上面的代码片段,并将“base”类分配给每个number_field_标记,将id“total base”分配给要显示总数的范围

<td class="method2">
  <p>Input the number of each base the primer should have</p>
  <label>Number of A :</label>
  <%= number_field_tag(:no_A,nil, in:0...36, class: 'bases') %><br />
  <label>Number of T :</label>
  <%= number_field_tag(:no_T,nil, in:0...36, class: 'bases') %><br />
  <label>Number of G :</label>
  <%= number_field_tag(:no_G,nil, in:0...36, class: 'bases') %><br />
  <label>Number of C :</label>
  <%= number_field_tag(:no_C,nil, in:0...36, class: 'bases') %><br />
  Total bases:<span id="total-bases"></span>
</td>
它的作用是在数字字段标记框内的任何键控或更改上,totalSides函数将运行。totalSides函数将临时变量(tmp)设置为0,并将变量total设置为0。然后,它使用类“base”迭代每个数字\字段\标记。它将内容解析为整数。如果输入不是一个数字(isNaN),它会通过将tmp设置为0来转储它,否则它会将变量total设置为td中所有数字\字段\标记内的值之和

然后,它将跨度中的html设置为这个总数

我想这就是你一直在寻找的,希望这会有所帮助。如果您还有其他问题,请告诉我,我会尽力帮助您

只要重新思考您的验证问题并意识到,您可以使用内置的数字\字段\标记选项。您可以使用:

min: 6
max: 36
或者更简单,美国:in=>6…36

in: 6...37
作为每个数字\字段\标签上的选项。这比我的第一个想法简单得多。。。这将使用jQuery验证插件库。。。尽管如此,当您想要对不太容易添加为rails表单帮助器选项的内容进行验证时,验证库是一件值得熟悉的事情

您的原始代码使用in:0…36-应该很简单,只要将0更改为6,将36更改为37,就可以得到6-36所允许的范围。如果不是,请告诉我,我将重新包含一些jQuery验证代码,并将您设置为该路径

以下是jQuery验证方法的一些示例代码:

jQuery.validator.addMethod("no-zero", function(value, element) {
return this.optional(element) || !/^0$/.test(value);
}, "Cannot be zero.");

基本上,只需将正则表达式替换为正确的正则表达式,以验证介于6和36之间的值,然后编写如果用户违反该值,您希望抛出的错误消息。

对于使用jQuery验证插件库,有几点需要注意

下载jquery validate.min.js文件,并通过将其放入assets/javascripts目录将其放入资产管道中

然后在application.js文件中

//require jquery.validate.min
然后,在jquery.validate.min.js文件中,可以放置类似于以下内容的方法

jQuery.validator.addMethod("no-zero", function(value, element) {
    return this.optional(element) || !/^0$/.test(value);
}, "Cannot be zero.");
这或多或少就是语法的用法——注意,我使用了一些通用名称等来告诉您将东西放在哪里

jQuery.validator.addMethod("methodName", function(value, element) {
  return this.optional(element) || /regex/.test(value);
}, "Error message here");
编写Regex来测试您想要验证的内容。要查看您的正则表达式,请访问www.rubular.com

要在视图中应用验证,请将类指定给要在表单中验证的对象。例如,现在你有

class: 'bases'
你可以再加上一些,比如

class: 'bases validation-method-name'
这种方法的一个好处是,您可以在整个应用程序中重用验证

差点忘了这一点:

您需要添加一个包含在页面上的js文件(或在现有js文件中包含类似以下内容的内容)。你会有这样的想法:

$(".method2").validate();

这将调用jquery validate library中需要的内容,以便对数字字段标记运行验证。

您找到了这个吗?如果没有,你能发布一些到目前为止的代码吗?信息越多,社区的帮助就越大。不,我没有解决方案。是的,你有没有可以发布的代码片段,可以显示你现在正在使用什么以及你想得到什么?嗨,Marccyr,我已经包含了编辑过的版本。我添加了第二个答案,让你开始jQuery验证。抱歉花了这么长时间-过去的一周太疯狂了。谢谢,这正是我想要做的。但是,有没有一种方法可以添加验证?我想将验证添加到总基数中。换句话说,总碱基最多只能是36个碱基,最少只能是6个碱基。我更新了答案,为您提供了一些信息,为您指明了正确的方向。重新思考您的问题,并再次更新答案,使之成为一种更简单的方法。注意:表单帮助器中的最小值和最大值控制箭头以及用户可以使用这些箭头输入的内容。。。对于全面的jQuery验证,请使用jQuery验证插件库:如果需要,我可以发布使用该库的示例代码。erm每个数字字段的最小值应为0 bcoz,它们可以是a,也可以是无。这就是我使用0的原因。然而,总的最大值只有36,最小值为6。所以我想我需要Jquery验证注意:这是用于前端验证的。您仍然应该研究添加模型验证的方法,以确保更好的覆盖率。
$(".method2").validate();