Question

我尝试使用onclick按钮在模态文本框中显示用户名我在%c呼叫onclick

时有一个按钮

onclick="getUserName(this.id)"

给我一个我想在

中设置的名字

this.id

这是我的功能

modal textbox userName

我在function getUserName(username) { $('#editUserPopUp').bind('show',function(){ alert(username); $("#userName").val(username); }); }收到用户名但是如何将thsi值设置为我的模态，用户名文本字段

这是我的模态

alert(username)

Answer 1

这应该有用。

但您还应该查看有关模态窗口的Bootstrap文档。有一节介绍如何改变模态内容。

Varying modal content based on trigger button

使用event.relatedTarget和HTML data- *属性（可能通过jQuery）根据点击的按钮改变模态的内容。

＆＃13;

function getUserName(username) {
  var $modal = $('#editUserPopUp'),
      $userName = $modal.find('#userName');
  $userName.val(username);
  $modal.modal("show");
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>


<button onclick="getUserName(this.id)" id="Foo Bar">Open Modal</button>

<div class="modal fade" id=editUserPopUp tabindex="-1" 
    role="dialog" aria-labelledby="helpModalLabel" aria-hidden="true">
  <div class="modal-dialog ">
    <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title" id="myModalLabel">Update Password</h4>
        </div>
        <div class="modal-body">                                                                                    
        <form class="EditUserBody" role="form" id="usermanagement_editUser="novalidate" method="POST">
          <div class="input-group col-md-8">
           <span class="input-group-addon">User Name</span>
             <input class="form-control" id="userName" type="text" class="input-medium" disabled />
          </div>           
        </form> 
       </div>   
    </div>
  </div>
</div>

＆＃13;

Answer 2

我认为问题在于您使用的是show事件，而是尝试调用shown事件，如下所示：

function getUserName(username) {
  $('#editUserPopUp').modal('show');

  $('#editUserPopUp').on('shown', function () {
    alert(username);
    $("#userName").val(username);
  })

}

p / s：没有测试它。希望这有帮助。评论是否有用。

使用Bootstrap使用onclick按钮在模态窗口中设置文本框值

2 个答案: