在导航栏中显示模态

Question

如果我点击一个项目，我想在其中显示模式的导航栏。标题

所以现在我在 js menupopulator 中显示我的导航栏，如下所示：

 function completeMenu(data, target) {
var prefix = "<ul class='nav navbar-nav navbar-right'>";
var sufix = "</ul>";
var items = data.d.results;
var menu = "";
for (var item in items) {
    if(items[item].Funcion != null && items[item].Funcion != ""){
        menu += "<li><a href=" + items[item].Enlace + " id='"+items[item].Funcion+"'>" + items[item].Title + "</a></li><li class='divider-vertical'></li>";
    }
    else
        menu += "<li><a href=" + items[item].Enlace + ">" + items[item].Title + "</a></li><li class='divider-vertical'></li>";

所以我想要的是 items[item].Title is == SignIn 显示模式而不是打开另一个链接...我可以这样做吗？

我尝试这样的事情：

for (var item in items) {
    if(items[item].Funcion != null && items[item].Funcion != ""){
        menu += "<li><a href=" + items[item].Enlace + " id='"+items[item].Funcion+"'>" + items[item].Title + "</a></li><li class='divider-vertical'></li>";
    }
    else
        menu += "<li><a href=" + items[item].Enlace + ">" + items[item].Title + "</a></li><li class='divider-vertical'></li>";

    if(items[item].Title == "SignIn"){
     menu += "<li><a href="#mymodal" data-toggle="modal" data-target="#mymodal"></a></li>"
    }
   }

    }

但我不想显示按钮，我想显示像我的菜单弹出器这样的 href

然后在视野中：

<div id="mymodal" class="fade modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">
            <asp:Label runat="server" ID="lblHeader"></asp:Label></h4>
    </div>
    <div class="modal-body">
    <p>Test modal</p>
    </div>

</div>
</div>

--------------更新------ ------------

有我的改变，但是当我改变它时，我只得到一个标签说“真”

 function completeMenu(data, target) {
var prefix = "<ul class='nav navbar-nav navbar-right'>";
var sufix = "</ul>";
var items = data.d.results;
var menu = "";
for (item in items) {
    menu += "<li><a href=" + items[item].Enlace + ">" + items[item].Title + "</a></li><li class='divider-vertical'></li>";
    if(items[item].Title == "SignUp"){
menu += "<button type= button class=btn btn-link data-toggle= modal  data-target=#mymodal">""
}
}

$(target).html(prefix + menu + sufix);
}

Answer 1

据我了解，您还需要更改此行：

"<button type= button class=btn btn-default data-toggle= modal  data-target=#mymodal">

到这个：

"<button type= button class=btn btn-link data-toggle= modal  data-target=#mymodal">

Answer 2

好的，如果您只需要一个链接，点击它您将引用另一个页面并立即打开一个模型。您可以使用 js 来使用它。处理单击您需要显示模态的链接：

<button type="button" class:"btn-link js-signin-link" data-toggle="modal" data-target"#mymodal">

在你的 js 代码中：

$('.js-signin-link').on('click', function(){
     window.location.href = 'SomePageWhereYouNeedToGO.html';
});

或者你可以从另一边得到它：

<a href="#SomePageWhereYouNeedToGO.html" class="js-signin-link"></a>

在js中

$('.js-signin-link').on('click', function(){
    $('#mymodal').modal('show');
});