Bootstrap数据ID未传递值
[英]Bootstrap data-id not passing value
问题描述
In my code I have 
在我的代码中
<script>
$(document).on('click', 'a#coin', function(){
// get month
var val = $(this).attr('data-id');
$.post('alert.php', {coin: val}, function(data){
console.log(data);
});
});
</script>
This is the data toggle link for the modal 这是模态的数据切换链接
<a id="coin" href="#" data-id="BTC" data-toggle="modal" data-target="#alertmodal"><i class="fa fa-bell fa-lg" title="Set Alert for BTC" style="color:orangered"></i></a>
And in alert.php I simply have 在alert.php中，我只是
$coin = $_POST['coin'];
echo $coin;
The modal is popping up fine its just not passing the data-id value Unsure as to what Im doing wrong 模态弹出很好它只是不通过data-id值不确定我在做什么错
More code added 添加了更多代码
<?php
require('alert.php');
?>
<html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css.css" rel="stylesheet" type="text/css">
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<script>
$(document).ready(function(){
$("#liveprices").load("liveprices.php");
setInterval(function() {
$("#liveprices").load("liveprices.php");
}, 5000);
});
</script>
</head><body>
The function discussed here is loaded at the end of the document 此处讨论的功能在文档末尾加载
3 个解决方案
解决方案1
2 2017-11-28 14:25:08
Says bootstrap.min.js requires Jquery although jquery is loaded right above it
By default bootstrap uses jQuery slim version. 默认情况下，引导程序使用jQuery slim版本。 Slim version do not have $.ajax and related functions. Slim版本没有$.ajax和相关功能。 Use the jQuery full version. 使用jQuery完整版。
Use this jQuery 使用这个jQuery
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
Below is the comment from the slim version with the features removed 以下是精简版的注释，其中删除了功能
/*! jQuery v3.2.1 -ajax,-ajax/jsonp,-ajax/load,-ajax/parseXML,-ajax/script,-ajax/var/location,-ajax/var/nonce,-ajax/var/rquery,-ajax/xhr,-manipulation/_evalUrl,-event/ajax,-effects,-effects/Tween,-effects/animatedSelector | (c) JS Foundation and other contributors | jquery.org/license */
解决方案2
1 已采纳 2017-11-28 19:34:54
After a discussion over the chat regarding the requirements, we came to a conclusion that PHP is not at all required in this case and simple jQuery does the trick: 在讨论了有关需求的聊天之后，我们得出结论，在这种情况下完全不需要PHP，而简单的jQuery就能解决问题：
Requirements : 要求 ：
If you look at this screenshot you will see a list of coin names with an alarm icon .. When the relevant alarm icon is clicked I want it to pop up a modal and just assign and echo a variable value ( which will be the coin ) BTC etc 如果查看此屏幕截图，您将看到带有警报图标的硬币名称列表。单击相关警报图标时，我希望它弹出一个模态，然后分配并回显一个变量值（将是硬币）。 BTC等
Later on a form will be added which ideally will have that data added to a hidden field ready for submission 稍后将添加一个表单，理想情况下该表单会将数据添加到准备提交的隐藏字段中
Solution (one approach): 解决方法（一种方法）：
Relevant code changes: 相关代码更改：
$(document).on('click', 'a.coin', function(){
var val = $(this).attr('data-id'), modal = $('div#test-modal');
console.log(val);
modal.find('.modal-title').html('Get alerts for ' + val);
modal.find('.modal-body .alert-notification').html('Get alert notifications when ' + val + ' breaks strong support / resistance lines');
modal.modal('show');
});
解决方案3
0 2017-11-28 14:18:28
Since you are using document.on('click') , the $(this) may be somewhat confused. 由于您正在使用document.on('click') ，因此$(this)可能会有些混乱。 I might try $(event.target).closest('a#coin') in place of $(this) and see if it helps: 我可以尝试用$(event.target).closest('a#coin')代替$(this) ，看看是否有帮助：
$(document).on('click', 'a#coin', function(event) {
var val = $(event.target).closest('a#coin');
console.log(val);
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.