Question

过去几天我一直在调整代码。它来自我必须修改的旧项目。

脚本

<script src='http://code.jquery.com/jquery-latest.min.js'></script> 
<script src="/lib/bootstrap/js/bootstrap.min.js"></script>
<link href="/css/styles.css" rel="stylesheet" />
@*<script src="/js/jquery.js"></script>
  <script src="/js/date.js"></script>*@

<script src="/wijmo/controls/wijmo.min.js" type="text/javascript"></script>
<script src="/wijmo/controls/wijmo.input.min.js"></script>
<script src="/wijmo/controls/wijmo.grid.min.js" type="text/javascript"></script>
<script src="/wijmo/controls/wijmo.chart.min.js"></script>
<link href="/wijmo/styles/wijmo.min.css" rel="stylesheet" />
@*<link href="/css/bootstrap.min.css" rel="stylesheet" /> --- this S.O.B will make things white. Big "NO, NO" *@

模态：

<!-- Test Modal-->
<div class="modal fade" id="TestModal" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <!--Modal Header-->
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title">Modal Test</h4>
            </div>
            <!--Modal Body-->
            <div class="modal-body">
                <dl class="dl-horizontal">
                    <dt>Branch Code</dt>
                    <dd>
                        <input class="form-control" id="BC" type="text" />
                    </dd>
                    <dt>Branch</dt>
                    <dd>
                        <input class="form-control" id="B" type="text" />
                    </dd>
                    <dt>Company ID</dt>
                    <dd>
                        <input class="form-control" id="CID" type="text" />
                    </dd>
                </dl>
            </div>
            <!--Modal Footer-->
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal" id="TestEdit" onclick="CmdBranchEditOk_OnClick()">
                Ok
                </button>
                <button type="button" class="btn btn-danger" data-dismiss="modal" id="TestModalCancel">
                Cancel
                </button>
            </div>
        </div>
    </div>
</div>

Javascript功能：

<Script>
    @*Test Function*@
    function OpenModal() {
        $('#TestModal').modal('show');

        document.getElementById('BC').value = "Test";
        document.getElementById('B').value = "Test";
        document.getElementById('CID').value = "Test";

    }
</script>

触发（按钮）：

<button style="float:left" id="CmdAddBranch" type="button" class="btn btn-default" onclick="OpenModal()">Open Modal</button>

我在这里缺少什么？

Answer 1

检查您的控制台是否有java脚本错误

TypeError: document.getElementById(...) is null
document.getElementById('B').value = "Test";

小鸡这个 id = B“你错过了”这一行中的属性

 <input class="form-control" id=B" type="text" />

替换为

 <input class="form-control" id="B" type="text" />

Answer 2

在jquery part中添加此内容。请参阅 DEMO

 $('#CmdAddBranch').click(function(){

    $('#TestModal').modal('show');
    $('#BC').val("Test") ;
       $('#B').val("Test");
    $('#CID').val("Test");
});

无法使用JS函数打开Modal

2 个答案: