javascript - 如何打开模态 onclick？

Question

我想在按下输入类型“Verwijderen”时打开一个模式。但是不显示？我究竟做错了什么？例如，即使是 W3schools 示例也不适用于 Fiddle。我想我错过了一些东西，但是什么？

<td colspan="2">
<input type="submit" style="width:140px;" value="Opslaan"/>
<input
    type="submit"
    style="width:140px;"
    id="cancelForm"
    class="ketchUp-default"
    value="Annuleren"/>
<input
    type="submit"
    id="deleteEvent"
    value="Verwijderen"
    style="width:140px;"
    class="ketchUp-default"
    data-toggle="modal"
    data-target="confirm-delete"/>

<div
    class="modal fade"
    id="confirm-delete"
    tabindex="-1"
    role="dialog"
    aria-labelledby="myModalLabel"
    aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">Confirm Delete</h4>
            </div>

            <div class="modal-body">
                <p>You are about to delete one track, this procedure is irreversible.</p>
                <p>Do you want to proceed?</p>
                <p class="debug-url"></p>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-danger btn-ok">Delete</button>
            </div>
        </div>
    </div>
</div>

Answer 1

您使用的是 BootStrap 3 吗？我认为您的错误是您没有在输入的数据目标中使用“#”ID 选择器。将您的输入代码更改为:

<input
    type="submit"
    id="deleteEvent"
    value="Verwijderen"
    style="width:140px;"
    class="ketchUp-default"
    data-toggle="modal"
    data-target="#confirm-delete"/>

这是一个有效的 plunk .