How to pass a parameter from a link element to a modal window?(如何将参数从链接元素传递到模式窗口?)
问题描述
我有一张桌子.在表格的一个单元格中有一个这样的链接:<a data-toggle="modal" data-id="xyz" href="#remoteModal" data-target="#remoteModal">SOME_TEXT</a>
.
I have a table. In a cell of the table there is a link like this:
<a data-toggle="modal" data-id="xyz" href="#remoteModal" data-target="#remoteModal">SOME_TEXT</a>
.
当我单击此链接时,应该会打开一个模式.这是一个例子:
When I click on this link should open a modal. Here's an example:
<div class="modal fade" id="remoteModal" tabindex="-1" role="dialog" aria-labelledby="remoteModal" aria-hidden="true">
Some HTML/PHP Code
</div>
模态必须执行一些依赖于data-id"属性值的操作.准确地说,在 javascript 代码中我需要读取这个值:
The modal must perform some operations that depend on the value of "data-id" attribute. To be precise, in the javascript code I need to read this value:
<script type="text/javascript">
$(document).ready(function ( ) {
$('#remoteModal').on('show.bs.modal', function( event ) {
console.log( /* How do I read the value of data-id? */ );
});
});
我不知道如何在modal的javascript代码中读取这个属性的值.
I do not know how to read the value of this attribute in the javascript code of the modal.
非常感谢您的关注.
推荐答案
使用Modal 事件文档中提到的 .relatedTarget
属性:
Use the .relatedTarget
property mentioned in the Modal Event docs:
$(document).ready(function () {
$('#remoteModal').on('show.bs.modal', function (event) {
console.log($(event.relatedTarget).attr('data-id'));
});
});
这篇关于如何将参数从链接元素传递到模式窗口?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:如何将参数从链接元素传递到模式窗口?
基础教程推荐
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 直接将值设置为滑块 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01