【问题标题】:Addition and subtraction using HTML5 and either JS or ASP.NET使用 HTML5 和 JS 或 ASP.NET 进行加法和减法
【发布时间】:2014-10-22 20:28:03
【问题描述】:

我正在尝试在我的本地主机上设置一个非常、非常 的基本页面来添加和减去值。

我在 ASP.NET Razor 中设置了一个网页来执行此操作。问题是,我在 Web 应用程序开发方面相当缺乏经验。 Microsoft 的大量(而且通常是相互矛盾的)文档并没有真正的帮助,而且我可能对我正在尝试做的事情缺乏基本的理解。考虑到这一点,不要在这里钉死我。

我想要三个字段:第一个值、第二个值和结果输出。我有两个按钮可以选择加法或减法,还有另一个按钮来进行操作(如果你愿意的话,一个提交按钮)。显然,这些项目是 HTML 格式的。现在,我需要做手术。我将使用哪种语言来执行此操作:ASP.NET/Razor C#(“服务器”端)或 JavaScript(“浏览器”端)?我认为有两种方法可以做到,但我对如何实现这两种方法都有些模糊。

【问题讨论】:

    标签: c# javascript asp.net html razor


    【解决方案1】:

    我想你可能知道这一点,但这个问题非常广泛。我将尝试为您的一个问题(“服务器端或浏览器”)提供一个简单的答案:

    我可能会去服务器端,这样您就不必依赖启用 JS 的用户。但是,如果您知道您的用户有 JS 并且/或者您不在乎,那么 JS 会更快,因为它不必再次访问服务器。

    至于你是如何实现的,我想说这超出了stackoverflow的范围。

    【讨论】:

      【解决方案2】:

      是的,您的问题非常广泛,实现任务的方法的选择实际上取决于许多因素。无论如何,我写下了我认为你想在 JavaScript 和 jQuery 中执行的这个相当原始的版本,所以这一切都发生在客户端:

      <script>
      function addOperands() {
          var result = $('#operand1').val() + $('#operand2').val();
          $('#result').val(result);
      }
      
      function subtractOperands() {
          var result = $('#operand1').val() - $('#operand2').val();
          $('#result').val(result);
      }
      </script>
      
      <input id="operand1" type="number" value="5"/>
      <input id="operand2" type="number" value="6"/>
      <input id="result" type="number" disabled/>
      <button id="add" onclick="addOperands()">Add</button>
      <button id="subtract" onClick="subtractOperands()">Subtract</button>
      

      您可以在jsFiddle 中尝试一下。

      【讨论】:

        【解决方案3】:

        两者都可以做——但是告诉你如何在任何一个中实现它,虽然简单,但对于 StackOverflow 问题有太多的先决条件。 JavaScript 可能提供了最低的进入门槛,但如果您已经足够了解将页面提供给用户 - 创建具有所需数据的视图模型并在控制器操作中执行加法或减法应该不会太难使用 C#。

        JavaScript 中的大纲工作流程是-

        1. 通过 ID、名称或类在页面中查找输入(ID 对初学者来说最容易,因为它有一个简单的长期 API)

        2. 获取输入的值 - 您可能希望将这些分配给变量,但如果您引用了 DOM 元素,您可以直接使用这些值。

        3. 检查这些值实际上是数字,而不是字符串或其他您无法对其执行数学运算的值。

        4. 确定要执行的操作。一个简单的选择是让页面上的变量保持初始状态,然后通过按下相同的按钮来切换它,或者通过按下(点击)加法和减法按钮来改变它。

        5. 使用条件语句(“if”对于像您这样的两个选项情况最简单)对值执行所需的算术运算。将结果分配给变量。

        6. 创建一个新元素以包含答案并将其添加到页面中,或者修改现有页面元素的文本。

        以上需要在响应结果按钮上的点击事件的事件处理函数中完成。

        进一步的学习资源-

        对于 ASP.NET MVC/Razor-

        1. 将表单提交给控制器操作

        2. 控制器操作要么需要接受视图模型作为参数,要么需要单独的参数来表示要添加的数字和操作。

        3. 使用条件语句在 C# 中执行所需的操作 - 添加或减去值。将结果分配给变量。

        4. 将变量传递给视图以显示数据。

        5. 将视图结果或部分结果返回给用户(仅当通过 Ajax 提交请求并在模态窗口中显示结果时才使用部分结果 - 现在这太高级了)。

        进一步的学习资源-

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2019-12-21
          • 2023-03-13
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2021-05-16
          相关资源
          最近更新 更多