更改模态文本后打开模态时,e.preventDefault 不起作用。模态在不更改内容的情况下打开

avi*_*jee 1 javascript jquery bootstrap-modal

我试图在单击模态触发按钮时更改模态正文文本。模式正在打开,但模式正文文本没有改变。这是模态的代码:

<button type="button" class="btn btn-info open-modal" data-remote="false" data-toggle="modal"  data-target="#myModal">Register</button>

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
                <p>Some text in the modal.</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

然后是防止默认事件的来源

$('.open-modal').click(function(e)
{
    e.preventDefault();
    alert('hello i am jquery');
    $('#myModal').modal('show');
});
Run Code Online (Sandbox Code Playgroud)

为什么alert('你好我是jquery'); 行没有执行?

Shu*_*tri 5

当您的 HTML 优先于 jquery 时,可能会发生这种情况,因为您的按钮指定要使用以下属性打开的目标模式

data-remote="false" data-toggle="modal"  data-target="#myModal"
Run Code Online (Sandbox Code Playgroud)

去掉那些然后jquery就可以了

data-remote="false" data-toggle="modal"  data-target="#myModal"
Run Code Online (Sandbox Code Playgroud)
$('.open-modal').click(function(e)
{
    e.preventDefault();
    alert('hello i am jquery');
    $('#myModal').modal('show');
});
Run Code Online (Sandbox Code Playgroud)