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

时间:2014-11-21 13:52:44

标签: asp.net-mvc json

我是JSON和jqueries的新手。 我在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);
}

1 个答案:

答案 0 :(得分:0)

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

不需要Json功能。 (我的问题中的第二个代码块)