刷新验证码会重新加载整个页面

Question

我是JSON和jquery的新手。我在cshtml文件中创建了一个验证码，如下所示

<div class="row-fluid">
<div class="span3"></div>
<iframe id="CaptchaIfram" src="@Url.Action("ShowCaptchaImage")" scrolling="no"></iframe>
<div>
     <div class="span3"></div>
     <input id="RefreshCaptcha" type="submit" onclick="captcha()" value="Refresh" class="btn btn-success" />
</div>
</div>
<script type="text/javascript">
function captcha()
{
    document.getElementById("CaptchaIfram").contentDocument.location.reload(true);
}
</script>
in Controller:
public Captcha ShowCaptchaImage(int width, int height, int totalcharacters)
{
     return new Captcha(width, height, totalcharacters);
}

它工作正常，如果我单击刷新按钮，整个页面都会刷新，因为我使用的是 Url.Action 方法。为了避免这种情况，我使用了如下所示的 JSON。但是图像没有显示。任何人都可以让我知道我需要纠正的地方。

<div class="row-fluid">
<div class="span3"></div>
<iframe id="CaptchaIfram" onload="showCaptcha()" scrolling="no"></iframe>
<div>
    <div class="span3"></div>
    <input id="RefreshCaptcha" type="submit" value="Refresh" onclick="showCaptcha()" class="btn btn-success" />
</div>
</div>            
<script type="text/javascript">
function showCaptcha()
{
    var url = "/ESignature/ShowCaptchaImage";
    var target = '#CaptchaIfram';
    $.getJSON(url, { width: 200, height: 35, totalcharacters: 5 }, function (data) {
    document.getElementById("CaptchaIfram").src = data;
    });
}
</script>
public JsonResult ShowCaptchaImage(int width, int height, int totalcharacters)
{
    return Json(new Captcha(width, height, totalcharacters), JsonRequestBehavior.AllowGet);
}

Answer 1

我将刷新按钮的类型更改为客户端按钮，如下所示。它没有刷新整个页面。

不需要 Json 函数。（我问题中的第二个代码块）