如何将javascript函数绑定到bootstrap模式

本文介绍了如何将javascript函数绑定到bootstrap模式的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述 29岁程序员，3月因学历无情被辞！我有一个模态，我想用它来显示用户信息，它通常被称为按钮点击，如下所示 <！ - 管理员模式 - > < div class = modal fade id = adminModal tabindex = - 1 角色 = dialog aria-labelledby = myModalLabel aria-hidden = true > < div class = 模态对话框 > < div class = modal-content > < div class = modal -body > < 按钮 type = 按钮 class = close data-dismiss = modal aria-hidden = true > ×< / button > < br / > < div class = Imodalcont > < div class = form-group > < div class = thumbnail Iwidth > < img id = adminImg src = alt = 护照 > < / div > < / div > < div class = form-group > < div class = Iwidth > < label id = adname class = control-label > 以色列Eruoghene Asha < / label > < / div > < div class = Iwidth > < label id = adqual class = control-label > B.Sc < / label > < / div > < div class = Iwidth > < label id = adpos class = control-label > 所有者< / label > < / div > < / div > < / div > < div class = Imodalcont > < div 类 = 表格 - group > < 标签 class = control-label > 个人资料< / label > < label id = adprofile class = control-label label-font-weight > 这里< / label > < / div > < / div > < / div > < div class = 模态页脚 > < 按钮 id = nxt type = 按钮 class = btn mybtn-link onclick = next（） > next>> < / button > < / div > < / div > <！ - /.modal-content - > < / div > <！ - /.modal dialog - > < / div > <！ - /.modal - > 按此按钮调用模态 < 按钮 id = admod class = btn btn-default 类型 = 提交 onclick = next（） > 查看信息< / button > 我尝试了什么：这是我的javascript代码此数据来自onsuccess调用一个初始的ajax请求如图所示 $ .ajax（{ type： POST， url： / Ministry / getSchlBase， data：{ schl名称：schnm}，成功： function （custs）{ // 这是我想要在模态上显示的所有数据的地方 // 单击下一个按钮时（' ＃admod'）。click（ function next（）{ // 我将此功能设置为上面按钮的onclick事件 // 添加第一个管理员信息。只要点击上面的按钮，这就是我想要的模态上的第一个信息 var admin1 = custs [ 1 ]; var name = admin1.split（' '）[ 1 ] + + admin1.split（' '）[ 2 ] + + admin1.split（' '）[ 3 ]; } ， function next（）{ // 添加第二个管理员信息。这是我想要在点击下一个按钮后显示的第二个管理员信息 var admin2 = custs [ 2 ]; var name = admin2.split（' ''）[ 1 ] + + admin2.split（' '）[ 2 ] + + admin2.split（' '）[ 3 ]; $（' ＃adname'）。text（name）; $（' ＃adprofile'）。text（admin2.split（' '）[ 4 ]）; $（' ＃adpos'）。text（admin2.split（' '）[ 5 ]）; $（' ＃adminImg'）。attr（' src'，admin2.split（' '）[ 6 ]）; $（' ＃adqual'）。text（admin2.split（' '）[ 7 ]）; }， function next（）{ // 添加第三个管理员信息。这是我想要填充的第三个信息 var admin3 = custs [ 3 ]。 var name = admin3.split（' '）[ 1 ] + + admin3.split（' '）[ 2 ] + + admin3.split（' '）[ 3 ]; $ （' ＃adname'）。text（name）; $（＃adprofile'）。text（admin3.split（'' '）[ 4 ]）; $（' ＃adpos'）。text（admin3.split（' '）[ 5 ]）; $（' ＃adminImg'）。attr（' src'，admin3.split（' '）[ 6 ]）; $（' ＃adqual'）。text（admin3.split（' '）[ 7 ]）; count = 1 ; }）; }，错误： function （错误）{ alert（错误）; } }）; 请问我该如何处理。任何回复都将不胜感激。谢谢解决方案 .ajax（{ type： POST， url： / Ministry / getSchlBase， data：{ schlName ：schnm}，成功ss： function （custs）{ // 这是哪里我希望在模态上显示的所有数据都已获得 // 点击下一个按钮时（' ＃admod' ）.click（ function next（）{ // i将此函数设置为上面按钮的onclick事件 // 添加第一个管理员信息。只要点击上面的按钮，这就是我想要的模态上的第一个信息 var admin1 = custs [ 1 ]; var name = admin1.split（' '）[ 1 ] + + admin1.split（' '）[ 2 ] + + admin1.split（' '）[ 3 ]; } ， function next（）{ // 添加第二个管理员信息。这是我想要在点击下一个按钮后显示的第二个管理员信息 var admin2 = custs [ 2 ]; var name = admin2.split（' ''）[ 1 ] + + admin2.split（' '）[ 2 ] + + admin2.split（' '）[ 3 ]; （' ＃adname'）。text（name）; （' ＃adprofile'）。text（admin2.split（' '）[ 4 ]）; hi, i have a modal that i want to use to show user info and its normally called on button click as shown below <div class="modal fade" id="adminModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-body"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> × </button> <br /> <div class="Imodalcont"> <div class="form-group"> <div class="thumbnail Iwidth"> <img id="adminImg" src="" alt="passport"> </div> </div> <div class="form-group"> <div class="Iwidth"><label id="adname" class="control-label">Israel Eruoghene Asha</label></div> <div class="Iwidth"><label id="adqual" class="control-label">B.Sc</label></div> <div class="Iwidth"><label id="adpos" class="control-label">Proprietor</label></div> </div> </div> <div class="Imodalcont"> <div class="form-group"> <label class="control-label">Profile</label> <label id="adprofile" class="control-label label-font-weight">sth here</label> </div> </div> </div> <div class="modal-footer"> <button id="nxt" type="button" class="btn mybtn-link" onclick="next()">next >></button> </div> </div> </div> </div>that modal is called by this button click<button id="admod" class="btn btn-default" type="submit" onclick="next()">View Info</button>What I have tried:here's my javascript codethis data is gotten in the onsuccess call of an initial ajax request as shown$.ajax({ type: "POST", url: "/Ministry/getSchlBase", data: { "schlName": schnm}, success: function (custs) { // this is where all the data i want to show on the modal is gotten //When next button is clicked ('#admod').click(function next() {//i set this function to the onclick event of the button above //adding first admin info. This is the first info i want on the modal as soon as the button above is clicked var admin1 = custs[1]; var name = admin1.split('"')[1] + " " + admin1.split('"')[2] + " " + admin1.split('"')[3]; },function next(){ //adding second admin info. this is the second admin info i want shown after a next button is clicked var admin2 = custs[2]; var name = admin2.split('"')[1] + " " + admin2.split('"')[2] + " " + admin2.split('"')[3]; $('#adname').text(name); $('#adprofile').text(admin2.split('"')[4]); $('#adpos').text(admin2.split('"')[5]); $('#adminImg').attr('src', admin2.split('"')[6]); $('#adqual').text(admin2.split('"')[7]); },function next(){ //adding third admin info. this is the third info i want populated var admin3 = custs[3]; var name = admin3.split('"')[1] + " " + admin3.split('"')[2] + " " + admin3.split('"')[3]; $('#adname').text(name); $('#adprofile').text(admin3.split('"')[4]); $('#adpos').text(admin3.split('"')[5]); $('#adminImg').attr('src', admin3.split('"')[6]); $('#adqual').text(admin3.split('"')[7]); count = 1; }); }, error: function (error) { alert(error); } });please how do i go about it.any response would be appreciated. Thanks 解决方案 .ajax({ type: "POST", url: "/Ministry/getSchlBase", data: { "schlName": schnm}, success: function (custs) { // this is where all the data i want to show on the modal is gotten //When next button is clicked ('#admod').click(function next() {//i set this function to the onclick event of the button above //adding first admin info. This is the first info i want on the modal as soon as the button above is clicked var admin1 = custs[1]; var name = admin1.split('"')[1] + " " + admin1.split('"')[2] + " " + admin1.split('"')[3]; },function next(){ //adding second admin info. this is the second admin info i want shown after a next button is clicked var admin2 = custs[2]; var name = admin2.split('"')[1] + " " + admin2.split('"')[2] + " " + admin2.split('"')[3];('#adname').text(name);('#adprofile').text(admin2.split('"')[4]); 这篇关于如何将javascript函数绑定到bootstrap模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！上岸，阿里云！