Question

首先，我的bootstrap模式是这样的：

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

      <div class="modal-content">

         <-- modal
                  header -->

         <div class="modal-body">
            <form class="form-horizontal" id="composeForm" method="POST" action="composeMessage">
              <div class="form-group">
               <label class="col-sm-2 control-label">To</label>
                <div class="col-sm-8">
                  <input type="text" class="form-control" id="sendToId" name="requestId">
                </div>
              </div>
            <div class="line line-dashed b-b line-lg pull-in"></div>
               <div class="form-group">
                 <label class="col-sm-2 control-label">Message</label>
                 <div class="col-sm-8">
                   <div class="btn-toolbar m-b-sm btn-editor" 
                                    data-role="editor-toolbar" data-target="#editor"></div>
                   <div id="editor" class="form-control" style="overflow:scroll;
                               height:150px;max-height:150px" contenteditable="true"></div>
                   <textarea style="display:none" id="divText" name="message"></textarea>
                 </div>
                </div>
            </form>
          </div>
           <div class="modal-footer">
            <button type="button" id="sendSave" class="btn btn-primary">Save changes</button>
           </div>
       </div>

    </div>
</div>

到目前为止我的Javascript是这样的：

$(function(){
var message;
 $("#myModal").on('show.bs.modal', function(event){
     var atag = $(event.relatedTarget);   //I'm using a tag to open modal
     var userNick = atag.data("nick");
     var userComp = atag.data("comp");

     var modal = $(this);

     /*
      skipped all dynamically setting values & changing attributes of tags
      */

    document.getElementById("divText").value = document.getElementById("editor").innerHTML;
    message = document.getElementById("divText").value;
 });
     $("button.btn.btn-primary").on('click', function(){
         alert(message);
     });
 });

首先，我在同一个JSP中有foreach循环，并且打开模态的锚标签就在其中。所以我有多个锚标签。

锚标记打开模式如下：

<a href="#myModal" data-target="#myModal" data-toggle="modal" 
                    data-nick="${f.recomUserNick}" data-comp="${f.compatibility}">

我设法动态设置值和更改属性，现在我尝试将数据从模态发送到控制器（Spring MVC）。

但是，我在收到“消息”时遇到问题。在模态中，客户端写了一些东西，我首先想要得到它的字符串值并检查警报，看看我以后是否可以将它发送给控制器。会发生的事情是，当我第一次打开模态时，在其中写入内容，然后单击按钮（在模态页脚中，id =＆＃34; sendSave＆＃34;），我无法收到消息。我关闭模态，再次打开它 - 在消息区域它有我写的东西。我单击按钮，然后在警报窗口中看到我的消息。

首先，当我重新打开模态时，我不想看到之前写的内容，我想第一次得到字符串值，而不必再次打开模态。我没有遇到字符串值的问题，所以我认为问题出在我放置代码的地方，所以我将代码移动了几个小时没有成功。你能告诉我如何修改我的代码吗？提前谢谢。

Answer 1

您在'message'中设置了$("#myModal").on('show.bs.modal' var。此时（在第一个节目中）消息尚未输入。

如果您将该代码移至click处理程序，则会在之后输入消息：

$("button.btn.btn-primary").on('click', function() { document.getElementById("divText").value = document.getElementById("editor").innerHTML; message = document.getElementById("divText").value; alert(message); });

如何传递和获取模态值

1 个答案: