部分视图模式呈现双击

我遇到了这个奇怪的问题，这让我有点疯狂。我有一个MVC 5项目，它有一个局部视图，当点击一个按钮时它会作为模态出现。问题是，我必须连续两次单击按钮才能触发部分视图方法。显然这是因为我使用$(document)作为选择器来触发事件。否则它工作正常。我必须使用$(document)作为选择器，因为我正在动态生成按钮，并且使用任何其他选择器都不会注册点击处理程序。这是我的模式容纳：部分视图模式呈现双击

<div id="modal-container" class="modal fade" 
    tabindex="-1" role="dialog"> 
    <div class="modal-content"> 
    </div> 
</div>

这里有一个按钮触发事件的HTML：

<a class="modal-link" href="/Customer/EditGroup/@item.Customer_Group_Code"> 
     <img src="~/images/editIcon.png" alt="Edit" /> 
    </a>

jQuery的方法，我调用看起来像这样：

$(document).on('click', '.modal-link', function (e) { 
    e.preventDefault(); 
    $(this).attr('data-target', '#modal-container'); 
    $(this).attr('data-toggle', 'modal'); 

});

和这里是视图的控制器方法：

public ActionResult EditGroup(int id) 
    { 
     ViewBag.id = id; 
     return PartialView("_EditGroup"); 
    }

来源

2016-11-29 psyoptica

它与'$（document）'无关。你在'第一'点击所做的就是添加'data-target'和'data-toggle'属性。在第二次点击中，因为现在存在这些属性，所以现在已经触发了模式（但是您再次添加了一些有点没有意义的属性）。你需要给出更多关于你实际做什么的背景，但是最初需要添加'data- *'属性 –

你是对的。我基本上是按照这样的方式学习了一个教程。我将数据属性添加到固定它的按钮上。 Sill这很奇怪，为什么当我使用除$（document）以外的其他选择器时，模式弹出 – psyoptica

将您的命令添加到：return false;。这应该做的修复。

$(document).ready(function() {  
    $(document).on('click', '.modal-link', function (e) { 
     e.preventDefault(); 
     $(this).attr('data-target', '#modal-container'); 
     $(this).attr('data-toggle', 'modal'); 
     return false; 
    });  
});

来源

2016-11-29 13:11:02 ViVi

部分视图模式呈现双击

回答

相关问题