javascript - 如何使在控件中输入的值出现在查询字符串中的单引号内

Question

 <script>
  function myFunction() {
    var query = '?';
    var str = $( "form" ).serialize();
    $( "#results" ).text( query += str );
    
  }
  $( "input[type='sel'], input[type='text']" ).on( "submit", myFunction );
  $( "select" ).on( "submit", myFunction );
   myFunction();
  
</script>

echo'<input  id="submit" type="submit" value="SUBMIT" class="btn btn-success"  name="submit" onclick="myFunction()"/> ';
echo '<p id="results">&nbsp;</p></form>';

这是用于为控件生成查询字符串的 javascript，所以我使用 id=submit 和 event onclick=myFunction

如何使这个工作 onclick 事件和查询字符串应该打印在

标签上以及插入代码是什么请让我知道答案

例如:?gender='Male'&city='dwd'

Answer 1

要将查询字符串保存在数据库中，您不需要在 javascript 中执行此操作，请参见以下示例:

测试.php

<form method="post">
    <label> Name
        <input name="query[name]" type="text">
    </label>

    <label> Email
        <input name="query[email]" type="text">
    </label>

    <label> Phone
        <input name="query[phone]" type="text">
    </label>

    <button type="submit">Submit</button>
</form>

<?php

if ($_POST && isset($_POST['query'])) {
    $query = '?'. http_build_query($_POST['query']);

    //save the value of query in the database
    echo $query;
}

以上示例提交数组中所有输入的值并使用 http_build_query 构建查询

并使用ajax:

测试.php

<script type="text/javascript" src="/js/jquery.min.js"></script>
<form method="post">
    <label> Name
        <input name="query[name]" type="text">
    </label>

    <label> Email
        <input name="query[email]" type="text">
    </label>

    <label> Phone
        <input name="query[phone]" type="text">
    </label>
    <button type="submit" >Submit</button>
</form>
<script>
    $('form').on('submit',function(e){
        e.preventDefault();
        e.stopPropagation();

        $.ajax('/ajax.php', {
            method: 'POST',
            data: $('form').serialize()
        })
    });
</script>

ajax.php

<?php
if ($_POST && isset($_POST['query'])) {
    $query = '?'.http_build_query($_POST['query']);

    //save the value of query in the database
    echo $query;
}