模态打开时如何发送参数json数组?

时间:2016-05-13 12:16:04

标签: javascript jquery json bootstrap-modal

演示和完整代码如下:https://jsfiddle.net/xzxrp7nn/5/

我的HTML代码是这样的:

<div id="tes">

</div>


<!-- Modal Currency-->
<div class="modal fade" id="priceModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">


            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>

我的Javascript代码是这样的:

$(document).ready(function(){

        var priceModal = '{"attributes":{"Code":"DBL","Total":"200000"},"DayPrice":{"Date":"2016-05-26","Rate":"200000"}}';

        var isitable = '<button class="btn blue tes_button" data-toggle="modal" data-target="#priceModal" id="priceModal='+priceModal+'">tes</button>';

        $("#tes").html(isitable);
        $('#priceModal').on('show.bs.modal', function(e) {
            var param = e.relatedTarget.id;
            console.log(param);
        })
    })

当打开模态时,我想获取参数priceModal。我在console.log(param); $('#priceModal').on('show.bs.modal', function(e) { priceModal={

但结果是:$('ul:not(.disabled):last').css('border-right', '1px solid black');

解决我问题的任何解决方案?

谢谢

2 个答案:

答案 0 :(得分:1)

JSFiddle

您使用的报价不正确:

 $(document).ready(function(){

        var priceModal = "{'attributes':{'Code':'DBL','Total':'200000'},'DayPrice':{'Date':'2016-05-26','Rate':'200000'}}";

        var isitable = '<button class="btn blue tes_button" data-toggle="modal" data-target="#priceModal" id="priceModal'+priceModal+'">tes</button>';

        $("#tes").html(isitable);
        $('#priceModal').on('show.bs.modal', function(e) {
            var param = e.relatedTarget.id;
            console.log(param);
        });
    });

答案 1 :(得分:0)

嗯这是不建议的,但如果你想实现它,那么你可以在"的{​​{1}}分配期间删除idbutton仍会将DOM插入属性值,但这有助于获取值。同样,为""存储这样的值不是一个好习惯。您可以将其存储在同一id的任何data-*属性中。

下面的示例显示了在分配element

时删除""时会发生什么

id
$(document).ready(function() {

  var priceModal = '{"attributes":{"Code":"DBL","Total":"200000"},"DayPrice":{"Date":"2016-05-26","Rate":"200000"}}';

  var isitable = '<button class="btn blue tes_button" data-toggle="modal" data-target="#priceModal"'
    +' id=priceModal=' + priceModal + '>tes</button>';
       //^Remove "" from here
  $("#tes").html(isitable);
  $('#priceModal').on('show.bs.modal', function(e) {
    var param = e.relatedTarget.id;
    $('.modal-body').html(param);
  })
})
.clsDatePicker {
  z-index: 100000;
}