1

我是 ASP.NET MVC 的新手，现在我遇到了一个问题，如果复选框出现在页面上的时间晚于最初加载的页面。看下一个场景：当我单击一个按钮时，Javascript 处理程序调用控制器后操作，并将其结果 html 加载到某个具体的 div 中。此 html 包含不会对鼠标按下事件做出反应的复选框（不会更改其检查状态）。

如果复选框与整个页面一起呈现，则复选框可以正常工作，但如果稍后呈现（作为后期操作的结果）则不会。在这里查看我的标记：

<a name="button" onclick="handler();"></a>

在“按钮”上单击我想ActionResult从控制器中获取并将其放入 div：

<div id="resultWillBeLoadedIn">
    <!-- here is placeholder-->
</div>

下一个 html 将从 /SomeController/SomeAction 返回并加载到上面的 div 中：

<span class="check">
    <span class="checkbox">
        <input type="checkbox" name="form" value="2" />
    </span>
</span>

这是我的“按钮单击”的 Javascript 处理程序：

function handler() {
    var url = '/SomeController/SomeAction';
    $.post(url, { params... }, function (result) {
        $('#resultWillBeLoadedIn').html(result);
}

查看 CSS 的一部分（我完全不是 CSS 方面的专家，所以我不确定这是否是我需要在这里展示的。而且......（老实说）我不是作者，所以请告诉我是否需要更多）：

.check .checkbox{
float: left;
height: 12px;
width: 12px;
display: inline-block;
margin: 3px 5px 0 0;
cursor: pointer;
background: url(../img/checkbox.png) 0 0 no-repeat;
}
.check span.disable{
float: left;
height: 12px;
width: 12px;
margin: 3px 5px 0 0;
display: inline-block;
background: url(../img/checkbox.png) 0 -24px no-repeat;
}

请告诉我我缺少什么才能使复选框不仅在页面加载时正确呈现，而且在回发到某个 div 时呈现。

4

2 回答 2

0

您已经省略了复选框的处理程序，但您可能需要为其使用委托处理程序（on的文档）。本质上，您将处理程序委托给 DOM 中保留在页面上的更高级别元素（或者可能是 body 元素，如果没有更低级别的元素可以工作）并提供一个选择器过滤器，当调用处理程序以查看如果它匹配事件目标。通过这种方式，您可以拥有一个只应用一次的处理程序，并与稍后添加的动态元素一起使用。

$('body').on('click', 'input[type="checkbox"]', function() {
      // handler function
});
于 2012-12-22T20:46:38.750 回答
0

在回调中添加 html 后，连接一个点击处理程序。

$('selectCheckbox').on('click', handler);

鉴于这个问题，它可能是 CSS/样式问题。我认为某些元素漂浮在复选框上并阻止它被点击。您可以在 chrome 检查器中查看它，并查看当您将鼠标悬停在复选框上时悬停的内容吗？

于 2012-12-22T20:47:32.350 回答