Javascript 通过AJAX调用发送不同的数据，具体取决于是否提交了表单或是否单击了div

我有一个名为

search

的函数，它通过单击div或提交表单来调用

单击div时，通过AJAX调用将其

id

作为数据发送。但是，我想做的是，如果表单已提交，则通过AJAX调用发送输入的数据

我考虑过使用两个函数和AJAX调用，但是我觉得这是不必要的，必须有一个简单的解决方案

<div id="12" class="question"></div>
<div id="24" class="question"></div>
<div id="11" class="question"></div>

<form id="question" method="post">
<input type="text" name="enter" id="enter">
<input type="submit">
</form>

<script>
$(".question").click(search);
$("form#question").submit(search);

function search() {
   $.ajax({
      type: "POST",
      url: "sending.php",
      data: "example=" + this.id,
      success: function(data) {
         console.log(data);
      }
   });
}
</script>

$（“.question”）。单击（搜索）；
$（“表格#问题”）。提交（搜索）；
函数搜索（）{
$.ajax({
类型：“POST”，
url:“sending.php”，
数据：“example=“+this.id，
成功：功能（数据）{
控制台日志（数据）；
}
});
}

您可以使用

功能检查单击的内容：

var isDiv = $( this ).is( "div" );
// or 
// var isForm = $( this ).is( "form" );

然后决定发送什么：

data: isDiv ? ("example=" + this.id) : $( this ).serialize(),

简化：

data: $( this ).is( "div" ) ? ("example=" + this.id) : $( this ).serialize(),

我添加的第一件事是
event.preventDefault（）
以确保HTML页面保持在浏览器中，即使按下submit按钮

使用
var enter=$（“表单#问题输入#enter”）.val（）您可以检索字段enter的值。如果单击div，则该值为null

在ajax调用中，我使用带有字段id和名称的javascript对象，并将其用作数据参数

请注意，您应该将javascript代码放在一个单独的文件中。避免内联javascript可以更容易地防止XSS。读和读


试试这个，这会帮你确定

<div id="12" class="question">12</div>
<div id="24" class="question">24</div>
<div id="11" class="question">11</div>

<form id="question" method="post">
    <input type="text" name="enter" id="enter">
    <input type="submit">
</form>

<script>
    $(document).on('click','.question',function(){
        console.log($("input[name='enter']").val($(this).attr('id')));
        $("#question").submit();
    });
</script>

12
24
11
$（文档）.on（'click'，'question'，function（）{
console.log（$（$input[name='enter']）.val（$（this.attr（'id'））；
$（“#问题”）。提交（）；
});
我理解这一点有点困难。如果它不是div，那么如何获取输入文本的值？
serialize（）
函数将所有表单的输入序列化为字符串。您可以将输入重命名为
example
，序列化的字符串将是
example=输入值
<div id="12" class="question">12</div>
<div id="24" class="question">24</div>
<div id="11" class="question">11</div>

<form id="question" method="post">
    <input type="text" name="enter" id="enter">
    <input type="submit">
</form>

<script>
    $(document).on('click','.question',function(){
        console.log($("input[name='enter']").val($(this).attr('id')));
        $("#question").submit();
    });
</script>