PHP & Jquery 用外部文件刷新 id

Question

我正在尝试通过单击一个按钮来刷新我的页面的一个 ID。我尝试了几种方法，但其中 none 行得通。虽然我已经创建了按钮来刷新它，但它会保留页面的提交（触发验证事件）。因此，每次我单击该按钮时，他都会尝试提交表单，验证输入而不是刷新 div.

这是我现在的代码：

function refreshCaptcha() {
 $("#captcha_code").attr('src','./inc/captcha.php');
}

<div class="form-group">
<div class="col-xs-4">
    <button class="btn btn-sm btn-warning" id="refreshcap" name="refreshcap" onclick="refreshCaptcha();">
        <i class="fa fa-refresh push-5-r"></i>
        <img id="captcha_code" src="inc/captcha.php" />
    </button> 
</div>
<div class="col-xs-8">
 <div class="form-material floating">
  <input class="form-control" type="text" id="cap" name="cap">
  <label for="cap">Captcha</label>
 </div>
</div>
</div>

有人可以帮我找出问题所在吗？谢谢

Answer 1

我认为你的 JS 函数应该 return false；为了不提交表格。

<script>
function refreshCaptcha() {
    $("#captcha_code").attr('src','./inc/captcha.php');
    return false;
}
</script>

Answer 2

假设您的按钮在表单内，

在您的按钮中添加 type

这将阻止按钮提交您的表单

<button type="button" class="btn btn-sm btn-warning" id="refreshcap" name="refreshcap" onclick="refreshCaptcha();">
            <i class="fa fa-refresh push-5-r"></i>
            <img id="captcha_code" src="inc/captcha.php" />
    </button>

除此之外，您可以在函数结束时使用 javascript return false;

用js

<script>
    $(document).ready(function() {
        $("#refreshcap").on("click",function(event){
             event.preventDefault();
             $("#captcha_code").attr('src','./inc/captcha.php');
        });
    });
</script>

有了这个你就不需要调用点击事件了，无论类型是 button 还是 submit

PHP & Jquery 用外部文件刷新 id

PHP & Jquery Refresh id with external file

html

javascript

php

jquery

refresh

用js