在我的项目中,我尝试将模态 Bootstrap 添加到我的 View 之一,并使用 .load()
加载该 View ,问题是当我尝试加载该 View 时,它只出现黑色,我尝试使用 console.log()
来观察错误,我看到了这个
http://localhost:38212/Desafios/Details/Solucoes/Details?id=14
当我单击 div 触发模式时,我位于 /Desafios/Details
中,并且我想要转到 /Solucoes/Details
而不是所有网址,我不想将 .load()
url 添加到我之前的 url 中。我怎样才能做到这一点?
这是我的 jquery 函数
$("#VisualizarSolucao").click(function (event) {
var id = $(this).attr("data-id");
$("#modal").load("../Solucoes/Details?id=" + id, function () {
$("#modal").modal();
})
event.preventDefault()
});
我正在外部文件中加载js,这里是在点击事件上调用的VisualizarSolucao id
<div class="col-md-10" style="border-left:2px solid black">
<p style="text-align:left;padding-top:5px">
<a href="" id="VisualizarSolucao" data-id="@i.SolucaoId" style="font-weight:900">@i.SolucaoTitulo</a>
</p>
<br />
<div class="col-md-offset-4 col-md-8" style="text-align:right">
<text>Criado por <a href="#">@i.User.UserName</a> no dia @i.DataCriacao</text>
</div>
</div>
最佳答案
.load()
函数中的 url 需要为 "/Solucoes/Details?id="+ id
,但是您应该始终使用 >@Url.Action()
方法确保您的网址正确生成。
由于脚本位于外部文件中,并且 razor 代码不会在外部文件中解析,因此请将 html 更改为
<a href="#" class="VisualizarSolucao" data-url="@Url.Action("Details", "Solucoes", new { id = i.SolucaoId })">
请注意,id
已更改为 class
名称(您在循环中生成重复的 id
属性,这是无效的 html)。您还应该删除内联样式并使用 css。
然后将脚本更改为(不需要 event.preventDefault()
)
$('.VisualizarSolucao').click(function() { // class name selector
var url = $(this).data('url'); // use data(), not attr()
$("#modal").load(url, function () {
$("#modal").modal();
})
});
关于javascript - .load 开始新路径,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37761675/