如何通过单击或按 Enter 使用 PHP 使用 jQuery 函数

Question

我有两个不同的文本框（来自循环）。 现在数据正在通过“点击”事件提交。 但是现在我还想在“输入”按钮之后“发布”数据（例如 Facebook 评论）。 我怎样才能做到这一点？

这是我的代码

foreach ...
{ 
    <!-- First text box -->
    <input type="text" placeholder="Post your comment here" id="txt'.$FeedId.'" class="feed_in_input" name="">
    
    <img class="feed_reply_smiley2" data-coin='.$CoinId.' data-max2='.$postID.' data-min2='.$postID.' data-stat='.$PostStatus.' id="button'.$FeedId.'" src="'.base_url().'/assets/social/images/feed_reply_smiley.svg" alt="img">
     
    <!-- Second text box -->
    <input type="text" placeholder="Reply to '.$UserName.'" id="txt'.$FeedId.'" class="feed_in_input" name="">
     
    <img class="feed_reply_smiley" id="button'.$FeedId.'" src="'.base_url().'/assets/social/images/feed_reply_smiley.svg" alt="img">
}

这是我的脚本

$('.feed_reply_smiley2').unbind().click(function(e) {   
    //our code here
});

$('.feed_reply_smiley').unbind().click(function(e) {    
    //our code here
});

我只希望每当用户按下“输入”按钮到任何文本框时，函数应该执行与处理“点击”事件相同的功能。 我怎样才能做到这一点？

Answer 1

在表单标签中添加所有内容，之后您可以检测表单提交

<script>
function myfunction(e) {
    e.preventDefault();
    alert("yes");
}
</script>
<form method="post" onsubmit="myfunction(event)">
    <input name="something" />
    <input type="submit" />
</form>

preventDefault 将阻止提交数据的默认行为

Answer 2

这是如何处理文本输入中的输入的示例。 在你的情况下：

$('.feed_in_input').on('keyup', function(event) {
    if (event.keyCode == 13) {
        // 13 = Enter Key
        alert('enter key pressed.');
    }
});

接下来，如果您的目标是从几个不同的事件中触发相同的代码，那么第一步是将该代码设置为可调用函数。 例如：

function handleClickAndEnter() {
    // our code here
    alert('Action happened!');
}

现在您可以从每个处理程序调用该函数，例如：

$('.feed_reply_smiley').on('click', handleClickAndEnter);

$('.feed_reply_smiley2').on('click', handleClickAndEnter);

$('.feed_in_input').on('keyup', function(event) {
    if (event.keyCode == 13) {
        // 13 = Enter Key
        handleClickAndEnter();
    }
});

如果需要，您还可以将前 2 个处理程序合并为一个：

$('.feed_reply_smiley, .feed_reply_smiley2').on('click', handleClickAndEnter);

如果您的代码需要确定触发了哪个事件，则需要更进一步。 单击“运行代码片段”以查看所有工作。

 $('.feed_in_input').on('keyup', function(event) { if (event.keyCode == 13) { // Pass the event along to the handler handleClickAndEnter(event); } }); $('.feed_reply_smiley, .feed_reply_smiley2').on('click', function(event) { // Pass the event along to the handler handleClickAndEnter(event) }); // Now accept the event as a parameter function handleClickAndEnter(event) { // our code here if (event.target.nodeName == "INPUT") { alert('Someone hit enter!'); } else if (event.target.nodeName == "IMG") { alert('Someone clicked an image!'); } }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> Input 1: <input class="feed_in_input" type="text"> <br><img src="https://via.placeholder.com/350x65" class="feed_reply_smiley"> <br><br>Input 2:<input class="feed_in_input" type="text"> <br><img src="https://via.placeholder.com/350x65" class="feed_reply_smiley2">