javascript - 获取HTML Form Post方法的返回值

我在Mason组件(A.m)中有一个HTML表单，该表单使用post方法来调用另一个Mason组件(B.m)。我希望这个Mason组件(B.m)向Mason组件(A.m)中的HTML表单返回一个值。然后，我想将此返回值传递给Javascript函数。

我怎样才能做到这一点？我是Web开发的新手。

最佳答案

您需要提出AJAX请求。尽管并非绝对必要，但我建议您使用jQuery，这会使事情变得容易得多。也请看看这个问题:jQuery AJAX submit form

这是梅森(Mason)中的一个小例子，它当然非常简化，您应该添加一些错误检查和一些转义，但是我认为这可能是一个好的开始。您的A.mc组件可能如下所示:

<html>
<head>
  <title>This is A</title>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <script>
  $(document).ready(function() {

    $("#myform").submit(function() { // intercepts the submit event
      $.ajax({ // make an AJAX request
        type: "POST",
        url: "B", // it's the URL of your component B
        data: $("#myform").serialize(), // serializes the form's elements
        success: function(data)
        {
          // show the data you got from B in result div
          $("#result").html(data);
        }
      });
      e.preventDefault(); // avoid to execute the actual submit of the form
    });

  });
  </script>
</head>
<body>
  <form id="myform">
  <input type="text" name="mytext" />
  <input type="submit" />
  </form>

  <div id="result"></div>
</body>
</html>

它只是一个HTML页面，该页面加载了jQuery库并且包含您的表单，并且包含一些代码来指示表单在用户单击“提交”按钮时向B组件发出AJAX请求，然后在其中显示B组件返回的内容。您的结果div。

这可能是您的B.mc组件:

<%class>
  has 'mytext';
</%class>
I got this text <strong><% $.mytext %></strong> from your form,
and its length is <strong><% length($.mytext) %></strong>.

结果将是这样的:

MASON

javascript - 获取HTML Form Post方法的返回值