我有一个模态对话框功能,使用javascript / jquery脚本设置,当用户单击按钮时会弹出该脚本。我从按钮中提取数据以找出哪个按钮。但是弹出的文本在html中设置了一个调用脚本函数的div。
我的问题是,如何根据我在脚本中提取的数据自定义此文本。
以下是相关代码,让您了解我正在尝试做什么:
剧本:
<script>
$(function() {
$( "#dialog-modal" ).dialog({autoOpen: false, height: 250, width: 400, modal: true});
$( "#opener" ).click(function() {
$( "#dialog-modal" ).dialog( "open" );
$.get('/like_artist.php', {artist_id : $(this).data('artist_id')}, function(data) {
alert("Data Loaded: " + data.artist_id);
}, "json");
});
});
</script>
在这个div中调用它:
<div id="dialog-modal" title="Basic dialog">
<p>You have just liked </p>
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
用户点击的按钮(具有不同data-artist_id值的众多按钮之一):
<div class="button_row">
<button type="button" id="opener" data-artist_id="1">Play My City</button>
</div>
基本上我想让artist_id通知div来为每个按钮定制对话框中的文本。
非常感谢你的帮助!
答案 0 :(得分:1)
我认为你在找这样的东西?
$( "#opener" ).click(function(e) {
var text = '';
var artistId = $(e.target).data('artist_id');
switch(artistId) {
case 1: text = 'text for artist 1'; break;
case 2: text = 'text for artist 2'; break;
default: text = 'unknown'; break;
}
$('#idOfPTagWhereYouWantText').text(text);