javascript - 如何获取不同的模态内容

Question

嗨，我正在尝试获取不同的模式内容，但我不确定哪里出了问题，因为我是 JavaScript 新手

我的代码:

<a data-toggle="modal" data-target="#exampleModal" data-whatever="sampleText" >testData</a>



        <div class="modal fade bs-example-modal-sm" tabindex="-1" id="exampleModal">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                     <h4 class="modal-title" id="exampleModalLabel">New message</h4>
                     <form>
     <div class="form-group">
                <label for="recipient-name" class="control-label">Recipient:</label>
                <input type="text" class="form-control" id="recipient-name">
              </div>
              </form>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>


        <script type="text/javascript">
        $('#exampleModal').on('show.bs.modal', function (event) {
              var button = $(event.relatedTarget) // Button that triggered the modal
              var recipient = button.data('whatever') 
              var modal = $(this)
              modal.find('.modal-title').text('New message to ' + recipient)
              modal.find('.modal-body input').val(recipient)
            })
        </script>

我的目标是在输入文本框中显示“sampleText”。但我不明白。我只得到空盒子。还有一种方法可以在输入框中显示字符串列表。？抱歉，如果我的问题非常基本。

Answer 1

您的标记中没有 .modal-body 类的元素，选择器应为 .modal-content input。

modal.find('.modal-content input').val(recipient);

如果您指的是 * 分隔值的字符串列表，则可以定义一个数组并使用 Array.prototype.join 方法连接元素:

var list = ['an', 'array'];
var string = list.join('glue');
// ...
modal.find('.modal-content input').val(string);