使用按钮将表单连接到 jQuery 帖子

Posted 2023-05-09

【中文标题】使用按钮将表单连接到 jQuery 帖子

【英文标题】：Connect form to jQuery post with a button

【发布时间】：2020-07-19 14:23:18

【问题描述】：

我有这段代码，我用它在我的网站上实时显示一些结果。此表单在自动填写字段后起作用。我想用一个按钮来做这件事。这是我的代码：

function getStates() 
  var couplername = $('#couplername').val();

  $.post("http://memarooneh.com/wp-content/themes/publisher/includes/subscribe.php", 
    couplername: couplername
  , function(data) 
    $("#order_price").show();
    $("#order_price").html(data);
  );

【问题讨论】：

你现在怎么打电话给getStates()？只需在您需要的任何按钮上的单击事件下调用它

@RoryMcCrossan 它会在<div id="order_price"></div> 中显示，无需任何点击

某些东西有来触发这个功能。

你能分享一下这个 JS sn-p 背后的 HTML 吗？而且你应该更好地描述你想要实现的场景，看起来你有点困惑。

【参考方案1】：

通过您创建的函数发布 AJAX 请求的简单方法是使用 onClick 处理程序，如下所示

<button onclick="getStates()" id="subscribe_btn">Subscribe</button>

【参考方案2】：

我把我的代码改成了这个，但还是不行@RoryMcCrossan

<script>

function getStates() 

  var couplername = $('#couplername').val();
  var couplercount = $('#couplercount').val();
  var couplerlathing = $('#couplerlathing').val();
  var couplerwhois = $('#couplerwhois').val();
  var couplerdetailsname = $('#couplerdetailsname').val();
  var couplerdetailsid = $('#couplerdetailsid').val();
  var couplerdetailsnumber = $('#couplerdetailsnumber').val();

  $( "#target" ).click(function() 
    $.post("http://memarooneh.com/wp-content/themes/publisher/includes/subscribe.php",  couplername:couplername, couplercount:couplercount, couplerlathing:couplerlathing, couplerwhois:couplerwhois, couplerdetailsname:couplerdetailsname, couplerdetailsid:couplerdetailsid, couplerdetailsnumber:couplerdetailsnumber );
  );

  function(data) 
    $("#order_price").show();
    $("#order_price").html(data);
  ;



</script>

【参考方案3】：

我想这就是你需要的。

$(document).ready(function() 
    $( "#target" ).click(getStates);
);

function getStates() 

  var couplername = $('#couplername').val();
  var couplercount = $('#couplercount').val();
  var couplerlathing = $('#couplerlathing').val();
  var couplerwhois = $('#couplerwhois').val();
  var couplerdetailsname = $('#couplerdetailsname').val();
  var couplerdetailsid = $('#couplerdetailsid').val();
  var couplerdetailsnumber = $('#couplerdetailsnumber').val();

  $.post(
     "http://memarooneh.com/wp-content/themes/publisher/includes/subscribe.php", 
      couplername:couplername, couplercount:couplercount, couplerlathing:couplerlathing, couplerwhois:couplerwhois, couplerdetailsname:couplerdetailsname, couplerdetailsid:couplerdetailsid, couplerdetailsnumber:couplerdetailsnumber ,
     function(data) 
       $("#order_price").show();
       $("#order_price").html(data);
     );

【参考方案4】：

我修复了我的代码，但现在我有新问题

function getStates() 

  var email = $('#email').val();

  $( ".submit" ).click(function() 

    $.post("<?php echo get_template_directory_uri(); ?>/download-func.php",  email:email ,

    function(data) 
      $("#order_price").show();
      $("#order_price").html(data);
    );

  );

现在我的代码可以运行，但问题在于结果的显示。你可以在这个链接上看到

http://memarooneh.com/downloads2/ 在文本字段中写一些东西，然后点击按钮

【讨论】：

首先：您不必在每次有更新时都在线程中添加答案，您应该编辑您的第一个帖子。第二：*** 上的人并不是要修复你的作品的人。