关于echarts和span onclick事件冲突的问题

<div id="tit" style="width: 500px;">
                <h2 class="h2font">呼叫系统走势图</h2>
                <!--<button onclick="tab1();">切换1</button><button onclick="tab2();">切换2</button><button onclick="tab3();">切换3</button>-->
                <div class="drawTab">
                    <span class="span1" id="s1" onclick="tab1()">月度</span>
                    <span class="span2" id="s2" onclick="tab2()">季度</span>
                    <span class="span3" id="s3" onclick="tab3()">年度</span>
                </div>
            </div>
            <div id="container" style="height: 100%;"></div>

这段代码实现的是通过span的onclick事件实现echarts页面的切换,之前我的上个问题和这个也有关系,目前把错误定位到echarts的这段代码上面
tooltip: {
trigger: 'axis'
},
去掉这个属性,onclick事件正常触发,但是echarts图形就没发看了,没有数据只有图形。
但是不去掉这个属性,onclick事件触发不了

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
如何在`span`标签上捕获onClick事件?

<div class="post-text" itemprop="text"> <p>在我的 div 元素中有很多 span 标签,每个 div 都有个惟一的 id,我想在每个 div uniquley 中的 span 标签中添加一个 onclick 事件。该怎么做呢?</p> <pre><code> &lt;div class="bootstrap-tagsinput"id="1"&gt; &lt;span class="tag label label-info"&gt;Access control lists&lt;/span&gt; &lt;span class="tag label label-info"&gt;Network firewall&lt;/span&gt; &lt;/div&gt; &lt;div class="bootstrap-tagsinput"id="2"&gt; &lt;span class="tag label label-info"&gt;Access control lists&lt;/span&gt; &lt;span class="tag label label-info"&gt;Network firewall&lt;/span&gt; &lt;/div&gt; </code></pre> <p>我当前的脚本捕获了所有的 span 标签,但和 div 无关。</p> <pre><code> $('span.label-info').click(function() { var news=$('input[type=text][id="vuln&lt;?php echo $model-&gt;v_id;?&gt;"]').val()+','+$(this).text(); $('input[type=text][id="vuln&lt;?php echo $model-&gt;v_id;?&gt;"]').val(news); return false; }); </code></pre> <p>如何在每个 div 中分别捕捉到 span 标签?</p> </div>

标签上直接添加onclick事件和jq绑定onclick事件有什么区别

功能描述:点击按钮实现复制之后跳转 1. 标签上直接添加onclick事件: ``` <div class="btn watch-btn" onclick="handle()">查看TA的个人主页</div> ``` 2. jq绑定onclick事件 ``` <div class="btn watch-btn">查看TA的个人主页</div> ``` ``` <script> $(document).on('click', '.watch-btn', function(){ handle(); }); </script> ``` 现象: handle(); 方法中有个实例化对象,之后方法2jq绑定onclick事件需点击两次才能复制成功并跳转,而方法1只要点击就可以。 提问:请问这两个方式实现onclick事件有什么区别?

关于js给标签加onclick事件的问题

这是DOM编程艺术书上的一个例程: 就是在一个网页中点击链接,将网页中的图片替换,网页大致如下: ![图片说明](https://img-ask.csdn.net/upload/201509/18/1442583577_803467.png) html源程序如下: ![图片说明](https://img-ask.csdn.net/upload/201509/18/1442583042_678268.png) 用两种方式写js文件: 1、 ![图片说明](https://img-ask.csdn.net/upload/201509/18/1442583357_874862.png) 用这种方式写,每次点击显示的都是最后一幅图片 2、 ![图片说明](https://img-ask.csdn.net/upload/201509/18/1442583510_167868.png) 用这种方式写就没有问题 请问两者的区别在哪里?其中的工作过程和原理是怎样的?

关于JS的onclick事件的一个问题,以下是部分源码

``` <div id="tit" style="width: 500px;"><h2 class="h2font">呼叫系统走势图</h2> <button onclick="tab1();">切换1</button><button onclick="tab2();">切换2</button><button onclick="tab3();">切换3</button> <div class="drawTab"><span class="span1" onclick="tab1();">月度</span><span class="span2" onclick="tab2();">季度</span><span class="span3" onclick="tab3();">年度</span></div></div> <div id="container" style="height: 100%;"></div> </div> ``` 刚开始span 的样式没有定义好,所以使用的是button实现下面那个div echarts图表的一个切换,但是样式做好后,使用span的onclick事件来实现页面的切换的时候,如果button按钮存在的情况下,功能是正常的,如果把button去掉,就不能使用了,active和hover事件也都全部失效了

Jquery获取span选中事件

![图片说明](https://img-ask.csdn.net/upload/201508/04/1438659738_575517.png) ![图片说明](https://img-ask.csdn.net/upload/201508/04/1438659801_381327.png) 这个怎么获取到span选中后的事件,我想能够这个事件后根据span的值改变页面的显示 ![图片说明](https://img-ask.csdn.net/upload/201508/04/1438659981_549782.png)

循环遍历拼接的div中onclick事件失效

循环遍历拼接的div中onclick事件失效 是循环传入的id的问题 ``` for (var i in list) { var id=list[i].ID.toString; var deptname = list[i].DEPT_NAME; var realation_people = list[i].RELATION_PEOPLE; var starttime = list[i].STARTTIME; var endtime = list[i].ENDTIME; htmlStr = htmlStr + '<li class="aui-list-item aui-list-item-arrow" onclick="toOpenDetail('+id+')" ><div class="aui-list-item-inner" > <div class="aui-list-item-title" >' + deptname+ '用车申请'+'</div> <div class="aui-list-item-text aui-ellipsis-2" > <span >' + realation_people + '</span>' + starttime + '</div> </div> </li>'; } ``` 求高手求助 验证了是onclick事件中id的问题 不知是否需要转义符

js中的onclick事件点击一次后失效

如下,这是我的js中的两个函数 function my$(id) { return document.getElementById(id); } function xiala() { var xiala = my$("xiala"); xiala.style.transform = "rotateX(180deg)";//使被选中的元素旋转180deg } 下面是html主体 <img id="xiala" type="button" onclick="xiala()" src="imgs/icons/xiala1.png" /> 按理说,点击这张图片,它应该会来回旋转,但是这张图片的点击事件只触发了一次,之后再点击都没有反应,请问这是怎么回事? 下面是我用的图片 ![图片说明](https://img-ask.csdn.net/upload/201912/06/1575599797_834055.png)

js onclick 事件获得的值只显示一瞬间就消失了

利用onclick事件给下面两个input 标签赋值![在这里插入图片描述](https://img-blog.csdnimg.cn/20190531175100120.png) 页面是jsp页面, 两个var 对象都也能取到![在这里插入图片描述](https://img-blog.csdnimg.cn/20190531175250771.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjc2NTE0Nw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190531175543977.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190531175555444.png) 点击查询触发onclick事件后,msg 只能在点击的一瞬间显示出来,动图不知道怎么发,很纳闷,不是input标签的原因,console.log也是一瞬间. 有大神知道这是什么原因吗?

js动态改变button的onclick属性的问题

我现在有这样一个问题: 点一个按钮时,每点一次,会改变它的onclick事件为其它函数 <input type="button" onclick="fun1(this);"/> js: function fun1(curObj) { curObj.onclick="fun1(curObj);"; alert("fun1 occurred!"); } function fun2(curObj) { curObj.onclick="fun2(curObj);"; alert("fun2 occurred!"); } 我觉得在onclick的赋值有问题,,,不知杂个写啊....

使用onclick事件时,只能从while循环返回一个

<div class="post-text" itemprop="text"> <p>I am trying to iterate through each item in sql (there are 4), however; it is only returning one iteration. It should be noted that all of this info is in this vertical order in my PHP file</p> <p>javascript </p> <pre><code>&lt;script&gt; function showDiv() { if($("#hiddenDiv" ).css('display') == 'none') { $("#hiddenDiv" ).show(); }else { $("#hiddenDiv" ).hide(); } } &lt;/script&gt; </code></pre> <p>HTML</p> <pre><code>&lt;div class="panel-heading"&gt; &lt;span&gt;Checkout&lt;/span&gt; &lt;button onclick="showDiv()" class="btn btn-warning pull-right"&gt; &lt;span class="glyphicon glyphicon-chevron-down"&gt;&lt;/span&gt; &lt;/button&gt; &lt;/div&gt; </code></pre> <p>PHP</p> <pre><code> &lt;?php $query = "SELECT * FROM products ORDER BY id ASC"; $result = mysqli_query($connect, $query); if(mysqli_num_rows($result) &gt; 0) { while($row = mysqli_fetch_array($result)) { ?&gt; &lt;div class="col-md-3" style="display:none;" id="hiddenDiv"&gt; &lt;form method="post" action="shop.php?action=add&amp;id=&lt;?php echo $row['id']; ?&gt;"&gt; &lt;div style="border: 1px solid #eaeaec; margin: -1px 19px 3px -1px; box-shadow: 0 1px 2px rgba(0,0,0,0.05); padding:10px;" align="center"&gt; &lt;?php echo "&lt;img src=\"imeg/". $row["image"] . "\" " . "class=\"img-responsive\"&gt;"; ?&gt; &lt;h5 class="text-info"&gt;&lt;?php echo $row["p_name"]; ?&gt;&lt;/h5&gt; &lt;h5 class="text-danger"&gt;$ &lt;?php echo $row["price"]; ?&gt;&lt;/h5&gt; &lt;input type="text" name="quantity" class="form-control" value="1"&gt; &lt;input type="hidden" name="hidden_name" value="&lt;?php echo $row["p_name"]; ?&gt;"&gt; &lt;input type="hidden" name="hidden_price" value="&lt;?php echo $row["price"]; ?&gt;"&gt; &lt;input type="submit" name="add" style="margin-top:5px;" class="btn btn-default" value="Add to Cart"&gt; &lt;/div&gt; &lt;/form&gt; &lt;/div&gt; &lt;?php } } ?&gt; </code></pre> </div>

关于在tab中使用echarts大小为0的问题

小弟最近写一个程序时需要实现一个在tab栏中切换不同的echarts图标的显示问题:在tab栏切换后再切换回来其父盒子div有大小,但是echarts大小为0x0; 同时自己再测了一下,当我跳转到没有echarts的页面再跳转回有echarts的后echarts能正常显示,但是从一个有echarts页面A跳到另一个有echarts的页面B第一次可以成功,但再从B跳会A时,A中其它元素可以正常显示,但是echarts就是显示不出来,已经卡了好几天了,网上的方法也试了一下不知道是不是自己试的方法对不对,拜托各位大神帮忙看看谢谢! ![图片说明](https://img-ask.csdn.net/upload/202003/09/1583726384_608296.png) ![图片说明](https://img-ask.csdn.net/upload/202003/09/1583726395_852700.png) 实现过程是用把echarts放在不同的div中,通过tab按下时捕获的值给current从而让相应的div中的图表显示出来: ``` <div v-if="current === 'month'"> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleAccessBarInit" canvasId="accessBarCharts" ref="accessBarCharts" /> </div> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleBarInit" ref="barCharts" canvasId="bar" /> </div> <div class="wrap1"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleLineInit" ref="lineCharts" canvasId="line" /> </div> </div> <div v-if="current === 'quarter'"> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleAccessBarInit" canvasId="accessBarCharts" ref="accessBarCharts" /> </div> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleBarInit" ref="barCharts" canvasId="bar" /> </div> <div class="wrap1"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleLineInit" ref="lineCharts" canvasId="line" /> </div> </div> ``` 当按下了相应的tab后,会调用相应的获取数据函数: ``` // tab栏切换 handleChangeTabbar(e) { this.current = e.target.key; console.log("按下了tab栏"); console.log(this.current); if(this.current=="seven"){this.getChartData(7);} else if(this.current == "month"){ this.getChartData(30);} else if(this.current == "quarter"){this.getChartData(90)} else if(this.current == "halfyear"){this.getChartData(180)} else if(this.current == "year"){this.getChartData(365)} } ``` 在获取数据函数中最后调用了图表的初始化函数init: ``` async getChartData(typeChange) { const body = { stationId: this.stationId, "access-token": this.accessToken, type:typeChange } console.log(body) const resp = await post('/station/data_statistics', body); console.log(resp) const { code, data } = resp; let barXAxisData = []; let barSeriesData = []; let barAccessXAxisData = []; let barAccessSeriesData = []; let lineXAxisData = []; let lineSeriesData = []; let lineAccessSeriesData = []; let lineTotalSeriesData = []; if (code === 200) { console.log(data) let axleTotalNum = 0; let axleAccessNum = 0; let totalNum = 0; let accessNum = 0; // 遍历各车轴总车数 for(var k = 0, length = data.axleTotalNum.length; k < length; k++){ // 分别将对象中数据提到数组中,然后轴数给x轴,将总数给y轴 barXAxisData.push(data.axleTotalNum[k].axle) barSeriesData.push(data.axleTotalNum[k].num) // 把所有车轴的过车数加起来,在左上角显示过车总数 axleTotalNum = axleTotalNum + data.axleTotalNum[k].num } // 遍历各车轴超车数 for(var k = 0, length = data.axleAccessNum.length; k < length; k++){ barAccessXAxisData.push(data.axleAccessNum[k].axle) barAccessSeriesData.push(data.axleAccessNum[k].num) // 把所有车轴的超车数加起来,在右上角显示超车总数 axleAccessNum = axleAccessNum + data.axleAccessNum[k].num } // 遍历7日中各日过车总数 for(var k = 0, length = data.totalNum.length; k < length; k++){ //把日期存进x轴的数组 lineXAxisData.push(data.totalNum[k].day) // 把具体每日数目存进y轴的数组 lineTotalSeriesData.push(data.totalNum[k].num) // 统计的是7日的过车总数,其实与上面的各轴车过车总数结果一样 totalNum = totalNum + data.totalNum[k].num } // 遍历7日中各日超车总数 for(var k = 0, length = data.excessNum.length; k < length; k++){ console.log(k) // 只统计y轴数据即可,因为其与7日过车数在折线图中一起显示,上面已经有x轴 lineAccessSeriesData.push(data.excessNum[k].num) accessNum = accessNum + data.excessNum[k].num } console.log(lineXAxisData,barSeriesData,barAccessXAxisData,barAccessSeriesData,lineXAxisData,lineSeriesData) // 把折线图中的两个y轴数组存到同一个数组中? lineSeriesData.push(lineAccessSeriesData, lineTotalSeriesData); console.log(lineXAxisData) // 其实这4个变量是两两相等的 this.accessNum = accessNum; this.totalNum = totalNum; this.axleTotalNum = axleTotalNum; this.axleAccessNum = axleAccessNum; } console.log(lineXAxisData, lineSeriesData) this.initBarChart(barXAxisData, barSeriesData,typeChange) this.initAccessBarChart(barAccessXAxisData, barAccessSeriesData,typeChange) this.initLineChart(lineXAxisData, lineSeriesData,typeChange) }, ``` 图表初始函数如下,其中写明了一些图表基础设置并进行setoption: ``` initBarChart(xAxisData, seriesData,typeChange) { if(typeChange==7){ this.barOption = { title: { text: "近七日过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } } else if(typeChange==30){ this.barOption = { title: { text: "近一月过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } }else if(typeChange==90){ this.barOption = { title: { text: "近一季过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } }else if(typeChange==180){ this.barOption = { title: { text: "近半年过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } } this.$refs.barCharts.init() }, ``` 最后再于图表的html部分中绑定了下面函数进行渲染: ``` handleBarInit (canvas, width, height) { console.log("打印表2宽高"); console.log(this.wdith); console.log(this.height); barChart = echarts.init(canvas, null, { width: width, height: height, }) canvas.setChart(barChart) barChart.setOption(this.barOption,true) return barChart }, ``` 最后附上该页面完整代码,请大家帮忙看看谢谢~ ``` <template> <div class="historyContainer"> <div v-if="current === 'seven'"> <i-row> <i-col span="8" offset="2" i-class="col-class"> <div class="headerCard"> <h4>近七日过车数:</h4> <p>{{totalNum}}</p> </div> </i-col> <i-col span="8" offset="4" i-class="col-class"> <div class="headerCard"> <h4>近七日超车数:</h4> <p>{{accessNum}}</p> </div> </i-col> </i-row> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleAccessBarInit" canvasId="accessBarCharts" ref="accessBarCharts" /> </div> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleBarInit" ref="barCharts" canvasId="bar" /> </div> <div class="wrap1"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleLineInit" ref="lineCharts" canvasId="line" /> </div> </div> <div v-if="current === 'month'"> <i-row> <i-col span="8" offset="2" i-class="col-class"> <div class="headerCard"> <h4>近一月过车数:</h4> <p>{{totalNum}}</p> </div> </i-col> <i-col span="8" offset="4" i-class="col-class"> <div class="headerCard"> <h4>近一月超车数:</h4> <p>{{accessNum}}</p> </div> </i-col> </i-row> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleAccessBarInit" canvasId="accessBarCharts" ref="accessBarCharts" /> </div> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleBarInit" ref="barCharts" canvasId="bar" /> </div> <div class="wrap1"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleLineInit" ref="lineCharts" canvasId="line" /> </div> </div> <div v-if="current === 'quarter'"> <i-row> <i-col span="8" offset="2" i-class="col-class"> <div class="headerCard"> <h4>近一季过车数:</h4> <p>{{totalNum}}</p> </div> </i-col> <i-col span="8" offset="4" i-class="col-class"> <div class="headerCard"> <h4>近一季超车数:</h4> <p>{{accessNum}}</p> </div> </i-col> </i-row> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleAccessBarInit" canvasId="accessBarCharts" ref="accessBarCharts" /> </div> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleBarInit" ref="barCharts" canvasId="bar" /> </div> <div class="wrap1"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleLineInit" ref="lineCharts" canvasId="line" /> </div> </div> <div v-if="current === 'halfyear'"> <i-row> <i-col span="8" offset="2" i-class="col-class"> <div class="headerCard"> <h4>近半年过车数:</h4> <p>{{totalNum}}</p> </div> </i-col> <i-col span="8" offset="4" i-class="col-class"> <div class="headerCard"> <h4>近半年超车数:</h4> <p>{{accessNum}}</p> </div> </i-col> </i-row> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleAccessBarInit" canvasId="accessBarCharts" ref="accessBarCharts" /> </div> <div class="wrap"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleBarInit" ref="barCharts" canvasId="bar" /> </div> <div class="wrap1"> <mpvue-echarts lazyLoad :echarts="echarts" :onInit="handleLineInit" ref="lineCharts" canvasId="line" /> </div> </div> <div v-if="current === 'year'"> 这是一年 </div> <i-tab-bar fixed="true" :current="current" @change="handleChangeTabbar"> <i-tab-bar-item key="seven" icon="computer" current-icon="computer_fill" title="近一周"></i-tab-bar-item> <i-tab-bar-item key="month" icon="dynamic" current-icon="dynamic_fill" title="近一月"></i-tab-bar-item> <i-tab-bar-item key="quarter" icon="addressbook" current-icon="addressbook_fill" title="近一季"></i-tab-bar-item> <i-tab-bar-item key="halfyear" icon="setup" current-icon="setup_fill" title="近半年"></i-tab-bar-item> <i-tab-bar-item key="year" icon="mine" current-icon="mine_fill" title="近一年"></i-tab-bar-item> </i-tab-bar> </div> </template> <script> import echarts from 'echarts' import mpvueEcharts from 'mpvue-echarts'; import { post } from '@/api/request.js'; let barChart, accessBarChart, lineChart; export default { onLoad(options) { const { stationId, accessToken } = options; this.stationId = stationId; this.accessToken = accessToken; }, data() { return { current:'seven', stationId: '', accessToken: '', echarts, totalNum: 0, accessNum: 0, axleTotalNum: 0, axleAccessNum: 0, // type:7,//暂时默认七天 barOption: null, accessBarOption: null, lineOption: null } }, components: { mpvueEcharts }, mounted() { this.getChartData(7); }, methods: { initBarChart(xAxisData, seriesData,typeChange) { if(typeChange==7){ this.barOption = { title: { text: "近七日过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } } else if(typeChange==30){ this.barOption = { title: { text: "近一月过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } }else if(typeChange==90){ this.barOption = { title: { text: "近一季过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } }else if(typeChange==180){ this.barOption = { title: { text: "近半年过车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#2d8cf0', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } } this.$refs.barCharts.init() }, handleBarInit (canvas, width, height) { console.log("打印表2宽高"); console.log(this.wdith); console.log(this.height); barChart = echarts.init(canvas, null, { width: width, height: height, }) canvas.setChart(barChart) barChart.setOption(this.barOption,true) return barChart }, initAccessBarChart(xAxisData, seriesData,typeChange) { if(typeChange==7){ this.accessBarOption = { title: { text: "近七日超车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#5cadff', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } } else if(typeChange==30){ this.accessBarOption = { title: { text: "近一月超车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#5cadff', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } }else if(typeChange==90){ this.accessBarOption = { title: { text: "近一季超车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#5cadff', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } }else if(typeChange==180){ this.accessBarOption = { title: { text: "近半年超车车型", textStyle: { fontSize: 14 }, left: 'center' }, legend: { right: '14', data: [{name:'车轴数'}] }, grid: { left: 10, right: 20, bottom: 15, top: 30, containLabel: true }, color: ['#5cadff', '#19be6b', '#ff9900'], xAxis: { type: 'category', data: xAxisData, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'bar', name: '车轴数', label: { normal: { show: true, position: 'inside' } }, data: seriesData }] } } this.$refs.accessBarCharts.init() }, handleAccessBarInit (canvas, width, height) { console.log("打印表1宽高"); console.log(this.wdith); console.log(this.height); accessBarChart = echarts.init(canvas, null, { width: width, height: height }) canvas.setChart(accessBarChart) accessBarChart.setOption(this.accessBarOption,true) return accessBarChart }, initLineChart(xAxisData, seriesData,typeChange) { if(typeChange==7){ this.lineOption = { title: { text: "近7日车流量和超车数", textStyle: { fontSize: 14 }, left: 'center' }, tooltip: { show: true, trigger: 'axis', formatter: '日期:{b}\n{a0}: {c1}\n{a1}: {c0}' }, legend: { right: '14', orient: 'vertical', data: [{name:'总数'},{name:"超载数"}] }, grid: { left: 10, right: 20, bottom: 15, top: 50, containLabel: true }, color: ['#5cadff', '#ff9900'], xAxis: { data: xAxisData, triggerEvent : true }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'line', name: '超载数', data: seriesData[0] },{ type: 'line', name: '总数', data: seriesData[1] }] } } else if(typeChange==30){ this.lineOption = { title: { text: "近一月车流量和超车数", textStyle: { fontSize: 14 }, left: 'center' }, tooltip: { show: true, trigger: 'axis', formatter: '日期:{b}\n{a0}: {c1}\n{a1}: {c0}' }, legend: { right: '14', orient: 'vertical', data: [{name:'总数'},{name:"超载数"}] }, grid: { left: 10, right: 20, bottom: 15, top: 50, containLabel: true }, color: ['#5cadff', '#ff9900'], xAxis: { data: xAxisData, triggerEvent : true }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'line', name: '超载数', data: seriesData[0] },{ type: 'line', name: '总数', data: seriesData[1] }] } } else if(typeChange==90){ this.lineOption = { title: { text: "近一季车流量和超车数", textStyle: { fontSize: 14 }, left: 'center' }, tooltip: { show: true, trigger: 'axis', formatter: '日期:{b}\n{a0}: {c1}\n{a1}: {c0}' }, legend: { right: '14', orient: 'vertical', data: [{name:'总数'},{name:"超载数"}] }, grid: { left: 10, right: 20, bottom: 15, top: 50, containLabel: true }, color: ['#5cadff', '#ff9900'], xAxis: { data: xAxisData, triggerEvent : true }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'line', name: '超载数', data: seriesData[0] },{ type: 'line', name: '总数', data: seriesData[1] }] } } else if(typeChange==180){ this.lineOption = { title: { text: "近半年车流量和超车数", textStyle: { fontSize: 14 }, left: 'center' }, tooltip: { show: true, trigger: 'axis', formatter: '日期:{b}\n{a0}: {c1}\n{a1}: {c0}' }, legend: { right: '14', orient: 'vertical', data: [{name:'总数'},{name:"超载数"}] }, grid: { left: 10, right: 20, bottom: 15, top: 50, containLabel: true }, color: ['#5cadff', '#ff9900'], xAxis: { data: xAxisData, triggerEvent : true }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#999' } }, axisLabel: { color: '#666' } }, series:[{ type: 'line', name: '超载数', data: seriesData[0] },{ type: 'line', name: '总数', data: seriesData[1] }] } } this.$refs.lineCharts.init() }, handleLineInit (canvas, width, height) { console.log("打印表3宽高"); console.log(this.wdith); console.log(this.height); lineChart = echarts.init(canvas, null, { width: width, height: height }) canvas.setChart(lineChart) lineChart.setOption(this.lineOption,true) return lineChart }, async getChartData(typeChange) { const body = { stationId: this.stationId, "access-token": this.accessToken, type:typeChange } console.log(body) const resp = await post('/station/data_statistics', body); console.log(resp) const { code, data } = resp; let barXAxisData = []; let barSeriesData = []; let barAccessXAxisData = []; let barAccessSeriesData = []; let lineXAxisData = []; let lineSeriesData = []; let lineAccessSeriesData = []; let lineTotalSeriesData = []; if (code === 200) { console.log(data) let axleTotalNum = 0; let axleAccessNum = 0; let totalNum = 0; let accessNum = 0; // 遍历各车轴总车数 for(var k = 0, length = data.axleTotalNum.length; k < length; k++){ // 分别将对象中数据提到数组中,然后轴数给x轴,将总数给y轴 barXAxisData.push(data.axleTotalNum[k].axle) barSeriesData.push(data.axleTotalNum[k].num) // 把所有车轴的过车数加起来,在左上角显示过车总数 axleTotalNum = axleTotalNum + data.axleTotalNum[k].num } // 遍历各车轴超车数 for(var k = 0, length = data.axleAccessNum.length; k < length; k++){ barAccessXAxisData.push(data.axleAccessNum[k].axle) barAccessSeriesData.push(data.axleAccessNum[k].num) // 把所有车轴的超车数加起来,在右上角显示超车总数 axleAccessNum = axleAccessNum + data.axleAccessNum[k].num } // 遍历7日中各日过车总数 for(var k = 0, length = data.totalNum.length; k < length; k++){ //把日期存进x轴的数组 lineXAxisData.push(data.totalNum[k].day) // 把具体每日数目存进y轴的数组 lineTotalSeriesData.push(data.totalNum[k].num) // 统计的是7日的过车总数,其实与上面的各轴车过车总数结果一样 totalNum = totalNum + data.totalNum[k].num } // 遍历7日中各日超车总数 for(var k = 0, length = data.excessNum.length; k < length; k++){ console.log(k) // 只统计y轴数据即可,因为其与7日过车数在折线图中一起显示,上面已经有x轴 lineAccessSeriesData.push(data.excessNum[k].num) accessNum = accessNum + data.excessNum[k].num } console.log(lineXAxisData,barSeriesData,barAccessXAxisData,barAccessSeriesData,lineXAxisData,lineSeriesData) // 把折线图中的两个y轴数组存到同一个数组中? lineSeriesData.push(lineAccessSeriesData, lineTotalSeriesData); console.log(lineXAxisData) // 其实这4个变量是两两相等的 this.accessNum = accessNum; this.totalNum = totalNum; this.axleTotalNum = axleTotalNum; this.axleAccessNum = axleAccessNum; } console.log(lineXAxisData, lineSeriesData) this.initBarChart(barXAxisData, barSeriesData,typeChange) this.initAccessBarChart(barAccessXAxisData, barAccessSeriesData,typeChange) this.initLineChart(lineXAxisData, lineSeriesData,typeChange) }, // tab栏切换 handleChangeTabbar(e) { this.current = e.target.key; console.log("按下了tab栏"); console.log(this.current); if(this.current=="seven"){this.getChartData(7);} else if(this.current == "month"){ this.getChartData(30);} else if(this.current == "quarter"){this.getChartData(90)} else if(this.current == "halfyear"){this.getChartData(180)} else if(this.current == "year"){this.getChartData(365)} } } } </script> <style> .historyContainer{ width: 100%; height: 100%; } .headerCard{ display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; height: 30px; border: 1px solid #ccc; margin-top: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 14px; } .wrap{ margin-top: 20px; /* width:100%; */ width: 380px; height: 400px; } .wrap1{ margin-top: 20px; /* width:100%; */ width: 380px; height: 400px; margin-bottom: 50px } </style> ```

关于json与echarts的问题

第一段代码如下 ``` var data = ${fns:toJson(tblTemperature.tblTemperatureHistoryList)}; ``` 返回数组形式的是 ``` var data = [{"id":"0000000000000000000000000000000000000000000000000000000000000014","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-26 09:46:16","temperature":"30.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000019","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-26 12:52:11","temperature":"40.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000020","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-26 13:20:28","temperature":"20.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000027","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-04-27 14:17:09","temperature":"50.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}},{"id":"0000000000000000000000000000000000000000000000000000000000000040","isNewRecord":false,"remarks":"电源柜标签10","tagId":"E281CA0020000000000002DA","addTime":"2017-05-02 15:59:34","temperature":"70.0","tblTemperature":{"id":"1c3782ea07514577b04c1a87c3d824f0","isNewRecord":false}}]; ``` 我该如何把addTime和temperature放进Echarts的data中? ``` var temperature=[];//温度 var addTime=[];//获取时间 $.ajax({ type : "post", async : true,//异步请求 dataType : "json", url:"${ctx}/temperaturehistory/tblTemperature/axisTem?id=${tblTemperature.id}", data:{}, success : function(result) { temperature.push(result.temperature); addTime.push(result.addTime); myChart.setOption({ xAxis : [ { data : addTime } ], series : [ { data : temperature } ] }) } }); myChart.setOption(option); ``` 整个jsp也面 ``` <script type="text/javascript"> function addRow(list, idx, tpl, row){ $(list).append(Mustache.render(tpl, { idx: idx, delBtn: true, row: row })) } </script> </head> <body> <div id="main" style="width: 1500px; height: 600px;"></div> <div class="control-group"> <label class="control-label">子:</label> <div class="controls"> <table id="contentTable" class="table table-striped table-bordered table-condensed"> <thead> <tr> <th class="hide"></th> <th>1</th> <th>2</th> <th>3</th> <th>4</th> <shiro:hasPermission name="temperaturehistory:tblTemperature:edit"> <th width="10">&nbsp;</th> </shiro:hasPermission> </tr> </thead> <tbody id="tblTemperatureHistoryList"> </tbody> </table> <script type="text/template" id="tblTemperatureHistoryTpl">//<!-- <tr id="tblTemperatureHistoryList{{idx}}"> <td class="hide"> <input id="tblTemperatureHistoryList{{idx}}_id" name="tblTemperatureHistoryList[{{idx}}].id" type="hidden" value="{{row.id}}"/> <input id="tblTemperatureHistoryList{{idx}}_delFlag" name="tblTemperatureHistoryList[{{idx}}].delFlag" type="hidden" value="0"/> </td> <td> <input id="tblTemperatureHistoryList{{idx}}_tagId" name="tblTemperatureHistoryList[{{idx}}].tagId" type="text" value="{{row.tagId}}" maxlength="64" class="input-small "/> </td> <td> <input id="addTime" name="tblTemperatureHistoryList[{{idx}}].addTime" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate " value="{{row.addTime}}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:false});"/> </td> <td> <input id="temperature" name="tblTemperatureHistoryList[{{idx}}].temperature" type="text" value="{{row.temperature}}" class="input-small "/> </td> <td> <textarea id="tblTemperatureHistoryList{{idx}}_remarks" name="tblTemperatureHistoryList[{{idx}}].remarks" rows="4" maxlength="255" class="input-small ">{{row.remarks}}</textarea> </td> <shiro:hasPermission name="temperaturehistory:tblTemperature:edit"><td class="text-center" width="10"> {{#delBtn}}<span class="close" onclick="delRow(this, '#tblTemperatureHistoryList{{idx}}')" title="删除">&times;</span>{{/delBtn}} </td></shiro:hasPermission> </tr>//--> </script> <script type="text/javascript" src="/jeesite/static/js/echarts/echarts.js"></script> <script type="text/javascript" src="/jeesite/static/jquery/jquery-1.8.3.js"></script> <script type="text/javascript"> var myChart = echarts.init(document.getElementById('main')) option= { color: ['#ff3d3d', '#00a0e9', '#f603ff','#00b419','#5f52a0'], tooltip: { trigger: 'axis' }, legend: { x: 'left', padding: [10, 20,0,20], data:['温度'], }, grid: { left: '0', right: '3%', bottom: '3%', top:'13%', containLabel: true }, xAxis: { type: 'category', boundaryGap: false, splitLine:{//网格线 show: true, lineStyle:{ color:['#b1b1b1'], type:'dashed' } }, data: [] }, yAxis: { splitLine:{//网格线 show: true, lineStyle:{ color:['#b1b1b1'], type:'dashed' } } }, series: [ { name:'温度', type:'line', data:[], label: { normal: { show: true, position: 'top'//值显示 } } } ] }; var datai = ${fns:toJson(tblTemperature.tblTemperatureHistoryList)}; var temperature=[];//温度 var addTime=[];//获取时间 $.ajax({ type : "post", async : true,//异步请求 dataType : "json", data:{}, success : function(result) { for(var i =0;i<datai.length;i++){ for(var j=0;j<data[i].length;j++){ temperature.push(datai[i][j].temperatuer); addTime.push(datai[i][j].addTime); } } myChart.setOption({ xAxis :{ data:addTime }, series : { data:temperature } }) } }); myChart.setOption(option); //打印数据,用于测试数据是否得到 console.warn(temperature, addTime); </script> <script type="text/javascript"> var tblTemperatureHistoryRowIdx = 0, tblTemperatureHistoryTpl = $("#tblTemperatureHistoryTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,""); $(document).ready(function() { alert(1) var data = ${fns:toJson(tblTemperature.tblTemperatureHistoryList)}; for (var i=0; i<data.length; i++){ addRow('#tblTemperatureHistoryList', tblTemperatureHistoryRowIdx, tblTemperatureHistoryTpl, data[i]); tblTemperatureHistoryRowIdx = tblTemperatureHistoryRowIdx + 1; } }); </script> </div> </div> </body> ```

关于span标签点击传值的问题~

``` body标签已在页面加载的时候有init()方法了,请大神注意 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script language="jscript"> var searchService, markers = []; var citylocation,map,marker = null; var Mrzb; function init() { //根据用户的浏览器IP定位 得出”经纬度“ citylocation = new qq.maps.CityService({ complete : function(result){ map.setCenter(result.detail.latLng); } }); citylocation.searchLocalCity(); **//怎么样才能把<span></span>标签内的data-lat-code和data-long-code传进来** var center = new qq.maps.LatLng(“data-lat-code”,“data-long-code”); var map = new qq.maps.Map(document.getElementById('container'), { disableDefaultUI: true, panControl: false, zoomControl: false, scaleControl: false, center: center, zoom: 13, zoomControlOptions: { //设置缩放控件的位置为相对左方中间位置对齐. // position: qq.maps.ControlPosition.LEFT_CENTER, } }); } </script> </head> <body onLoad="init()"> <div class="cityb"> <ul> **//点击span标签,传值到上面的js或jq中** <li><span data-lat-code="24.919489" data-long-code="102.478485">安宁</span></li> <li><span data-lat-code="36.079834" data-long-code="114.389412">安阳</span></li> <li><span data-lat-code="32.684715" data-long-code="109.029022">安康</span></li> <li><span data-lat-code="26.253071" data-long-code="105.947594">安顺</span></li> <li><span data-lat-code="30.543489" data-long-code="117.063744">安庆</span></li> <li><span data-lat-code="40.299999" data-long-code="80.400002">阿拉尔</span></li> <li><span data-lat-code="41.108639" data-long-code="122.994324">鞍山</span></li> <li><span data-lat-code="22.186834" data-long-code="113.54303">澳门</span></li> </ul> </div> </body> </html> ```

关于span嵌套span标签的问题

![图片说明](https://img-ask.csdn.net/upload/201609/13/1473753370_994166.png) 如图所示span中嵌套了span为什么 > 和 5个可用的位置互换了? ![图片说明](https://img-ask.csdn.net/upload/201609/13/1473753468_127200.png) 注:我需要右浮的效果 但是不希望他两互换位置

onclick传递参数,function中接收不到的问题

``` <table border="0" cellpadding="0" cellspacing="0"> <%for(int i = 0;i<fileName.length;i++) {%> <tr><td style="text-align: left; " id = <%=i %>><%=fileName[i]%></td><td style="text-align: left;"><span style="color: #7D7D7D;"></span></td><td style="text-align: left;"> <input type="button" onclick="$('#fileName').attr('value','<%=fileName[i] %>');$('#folderType').attr('value','${ft}');$('#downloadform').submit();" value="下载">> <input type="button" onclick="deleteAtt(<%=fileName[i] %>,<%=i %>)" value="删除"> </td></tr> <%} %> </table> ``` ``` function deleteAtt(name1,id1){ alert("哈哈哈"); $("#"+id1).remove(); $.ajax({ type: "POST", url: "<%=basePath%>user/sendMail2!attachmentDelete.action?fileName="+name1, }); } ``` 请问onclick可以这样传参吗?还有哪里有问题,为什么alert执行不了,

C# 如下是lable控件绑定,在onclick事件中如何获取i的值(i是用户任意点击项的值)

for (int i = 0; i < dt.Rows.Count; i++) { text += dt.Rows[i]["G_Title"].ToString(); } lable1.text=text;

js 动态修改div的onclick属性

某个大的div:frameDiv 包含几个小的div:<div id="frameShow1" onclick='alert('1');'></div> <div id="frameShow2" onclick='alert('2');'></div> 动态设置frameShow1的onclick属性:document.getElementById('frameShow1').onclick=function(){alert("hahaha");} 但是,frameDiv的innerHTML打印出来,没有了onclick属性,请问这是为什么呢?谢谢啦~~~~~~~~

Js循环创建<span>标签,并赋予标签事件

![点击事件,获取输入值,并创建<span>标签,图片说明](https://img-ask.csdn.net/upload/201508/07/1438911052_926132.png)![<span>标签显示在页面,怎样给<span>标签设置事件,点击<span>标签将其删除图片说明](https://img-ask.csdn.net/upload/201508/07/1438911081_310380.png)

jQuery如何判断onclick是否触发,从而实现不同的代码?

# 比如:页面加载时,判断onclick是否触发,从而实现数据全部加载还是进行条件查询? **如:后台代码** string key = context.Request.QueryString["Keyword"]; //判断 if (key!=null) { //调用B层的方法从而获取数据库的Dataset ADO.SqlAdo ado = new ADO.SqlAdo(); string sql = "select * from tb_Provider where PrName like '%" + key + "%' or PrPeople like '%" + key + "%'or PrPhone like '%" + key + "%' "; DataSet ds = ado.getTable(sql); // DataSet ds = sqla.GetDataSet(strfaca); //将Dataset转化为Datable DataTable dt = ds.Tables[0]; int count = dt.Rows.Count; string strJson = Dataset2Json(ds, count);//DataSet数据转化为Json数据 context.Response.Write(strJson);//返回给前台页面 context.Response.End(); } else { //调用B层的方法从而获取数据库的Dataset ADO.SqlAdo ado = new ADO.SqlAdo(); string sql = "select * from tb_Provider "; DataSet ds = ado.getTable(sql); // DataSet ds = sqla.GetDataSet(strfaca); //将Dataset转化为Datable DataTable dt = ds.Tables[0]; int count = dt.Rows.Count; string strJson = Dataset2Json(ds, count);//DataSet数据转化为Json数据 context.Response.Write(strJson);//返回给前台页面 context.Response.End(); } ``` ``` **前台代码:** $(function () { $('#dg').datagrid({ url: 'ashx/ProviderQuery.ashx'//请求数据的URL 代码附后 }); }) ``` ```

在中国程序员是青春饭吗?

今年,我也32了 ,为了不给大家误导,咨询了猎头、圈内好友,以及年过35岁的几位老程序员……舍了老脸去揭人家伤疤……希望能给大家以帮助,记得帮我点赞哦。 目录: 你以为的人生 一次又一次的伤害 猎头界的真相 如何应对互联网行业的「中年危机」 一、你以为的人生 刚入行时,拿着傲人的工资,想着好好干,以为我们的人生是这样的: 等真到了那一天,你会发现,你的人生很可能是这样的: ...

程序员请照顾好自己,周末病魔差点一套带走我。

程序员在一个周末的时间,得了重病,差点当场去世,还好及时挽救回来了。

我以为我学懂了数据结构,直到看了这个导图才发现,我错了

数据结构与算法思维导图

String s = new String(" a ") 到底产生几个对象?

老生常谈的一个梗,到2020了还在争论,你们一天天的,哎哎哎,我不是针对你一个,我是说在座的各位都是人才! 上图红色的这3个箭头,对于通过new产生一个字符串(”宜春”)时,会先去常量池中查找是否已经有了”宜春”对象,如果没有则在常量池中创建一个此字符串对象,然后堆中再创建一个常量池中此”宜春”对象的拷贝对象。 也就是说准确答案是产生了一个或两个对象,如果常量池中原来没有 ”宜春” ,就是两个。...

技术大佬:我去,你写的 switch 语句也太老土了吧

昨天早上通过远程的方式 review 了两名新来同事的代码,大部分代码都写得很漂亮,严谨的同时注释也很到位,这令我非常满意。但当我看到他们当中有一个人写的 switch 语句时,还是忍不住破口大骂:“我擦,小王,你丫写的 switch 语句也太老土了吧!” 来看看小王写的代码吧,看完不要骂我装逼啊。 private static String createPlayer(PlayerTypes p...

Linux面试题(2020最新版)

文章目录Linux 概述什么是LinuxUnix和Linux有什么区别?什么是 Linux 内核?Linux的基本组件是什么?Linux 的体系结构BASH和DOS之间的基本区别是什么?Linux 开机启动过程?Linux系统缺省的运行级别?Linux 使用的进程间通信方式?Linux 有哪些系统日志文件?Linux系统安装多个桌面环境有帮助吗?什么是交换空间?什么是root帐户什么是LILO?什...

将一个接口响应时间从2s优化到 200ms以内的一个案例

一、背景 在开发联调阶段发现一个接口的响应时间特别长,经常超时,囧… 本文讲讲是如何定位到性能瓶颈以及修改的思路,将该接口从 2 s 左右优化到 200ms 以内 。 二、步骤 2.1 定位 定位性能瓶颈有两个思路,一个是通过工具去监控,一个是通过经验去猜想。 2.1.1 工具监控 就工具而言,推荐使用 arthas ,用到的是 trace 命令 具体安装步骤很简单,大家自行研究。 我的使用步骤是...

学历低,无法胜任工作,大佬告诉你应该怎么做

微信上收到一位读者小涛的留言,大致的意思是自己只有高中学历,经过培训后找到了一份工作,但很难胜任,考虑要不要辞职找一份他能力可以胜任的实习工作。下面是他留言的一部分内容: 二哥,我是 2016 年高中毕业的,考上了大学但没去成,主要是因为当时家里经济条件不太允许。 打工了三年后想学一门技术,就去培训了。培训的学校比较垃圾,现在非常后悔没去正规一点的机构培训。 去年 11 月份来北京找到了一份工...

JVM内存结构和Java内存模型别再傻傻分不清了

JVM内存结构和Java内存模型都是面试的热点问题,名字看感觉都差不多,网上有些博客也都把这两个概念混着用,实际上他们之间差别还是挺大的。 通俗点说,JVM内存结构是与JVM的内部存储结构相关,而Java内存模型是与多线程编程相关,本文针对这两个总是被混用的概念展开讲解。 JVM内存结构 JVM构成 说到JVM内存结构,就不会只是说内存结构的5个分区,而是会延展到整个JVM相关的问题,所以先了解下

和黑客斗争的 6 天!

互联网公司工作,很难避免不和黑客们打交道,我呆过的两家互联网公司,几乎每月每天每分钟都有黑客在公司网站上扫描。有的是寻找 Sql 注入的缺口,有的是寻找线上服务器可能存在的漏洞,大部分都...

Google 与微软的浏览器之争

浏览器再现“神仙打架”。整理 | 屠敏头图 | CSDN 下载自东方 IC出品 | CSDN(ID:CSDNnews)从 IE 到 Chrome,再从 Chrome 到 Edge,微软与...

讲一个程序员如何副业月赚三万的真实故事

loonggg读完需要3分钟速读仅需 1 分钟大家好,我是你们的校长。我之前讲过,这年头,只要肯动脑,肯行动,程序员凭借自己的技术,赚钱的方式还是有很多种的。仅仅靠在公司出卖自己的劳动时...

上班一个月,后悔当初着急入职的选择了

最近有个老铁,告诉我说,上班一个月,后悔当初着急入职现在公司了。他之前在美图做手机研发,今年美图那边今年也有一波组织优化调整,他是其中一个,在协商离职后,当时捉急找工作上班,因为有房贷供着,不能没有收入来源。所以匆忙选了一家公司,实际上是一个大型外包公司,主要派遣给其他手机厂商做外包项目。**当时承诺待遇还不错,所以就立马入职去上班了。但是后面入职后,发现薪酬待遇这块并不是HR所说那样,那个HR自...

女程序员,为什么比男程序员少???

昨天看到一档综艺节目,讨论了两个话题:(1)中国学生的数学成绩,平均下来看,会比国外好?为什么?(2)男生的数学成绩,平均下来看,会比女生好?为什么?同时,我又联想到了一个技术圈经常讨...

搜狗输入法也在挑战国人的智商!

故事总是一个接着一个到来...上周写完《鲁大师已经彻底沦为一款垃圾流氓软件!》这篇文章之后,鲁大师的市场工作人员就找到了我,希望把这篇文章删除掉。经过一番沟通我先把这篇文章从公号中删除了...

85后蒋凡:28岁实现财务自由、34岁成为阿里万亿电商帝国双掌门,他的人生底层逻辑是什么?...

蒋凡是何许人也? 2017年12月27日,在入职4年时间里,蒋凡开挂般坐上了淘宝总裁位置。 为此,时任阿里CEO张勇在任命书中力赞: 蒋凡加入阿里,始终保持创业者的冲劲,有敏锐的...

总结了 150 余个神奇网站,你不来瞅瞅吗?

原博客再更新,可能就没了,之后将持续更新本篇博客。

副业收入是我做程序媛的3倍,工作外的B面人生是怎样的?

提到“程序员”,多数人脑海里首先想到的大约是:为人木讷、薪水超高、工作枯燥…… 然而,当离开工作岗位,撕去层层标签,脱下“程序员”这身外套,有的人生动又有趣,马上展现出了完全不同的A/B面人生! 不论是简单的爱好,还是正经的副业,他们都干得同样出色。偶尔,还能和程序员的特质结合,产生奇妙的“化学反应”。 @Charlotte:平日素颜示人,周末美妆博主 大家都以为程序媛也个个不修边幅,但我们也许...

MySQL数据库面试题(2020最新版)

文章目录数据库基础知识为什么要使用数据库什么是SQL?什么是MySQL?数据库三大范式是什么mysql有关权限的表都有哪几个MySQL的binlog有有几种录入格式?分别有什么区别?数据类型mysql有哪些数据类型引擎MySQL存储引擎MyISAM与InnoDB区别MyISAM索引与InnoDB索引的区别?InnoDB引擎的4大特性存储引擎选择索引什么是索引?索引有哪些优缺点?索引使用场景(重点)...

如果你是老板,你会不会踢了这样的员工?

有个好朋友ZS,是技术总监,昨天问我:“有一个老下属,跟了我很多年,做事勤勤恳恳,主动性也很好。但随着公司的发展,他的进步速度,跟不上团队的步伐了,有点...

我入职阿里后,才知道原来简历这么写

私下里,有不少读者问我:“二哥,如何才能写出一份专业的技术简历呢?我总感觉自己写的简历太烂了,所以投了无数份,都石沉大海了。”说实话,我自己好多年没有写过简历了,但我认识的一个同行,他在阿里,给我说了一些他当年写简历的方法论,我感觉太牛逼了,实在是忍不住,就分享了出来,希望能够帮助到你。 01、简历的本质 作为简历的撰写者,你必须要搞清楚一点,简历的本质是什么,它就是为了来销售你的价值主张的。往深...

离职半年了,老东家又发 offer,回不回?

有小伙伴问松哥这个问题,他在上海某公司,在离职了几个月后,前公司的领导联系到他,希望他能够返聘回去,他很纠结要不要回去? 俗话说好马不吃回头草,但是这个小伙伴既然感到纠结了,我觉得至少说明了两个问题:1.曾经的公司还不错;2.现在的日子也不是很如意。否则应该就不会纠结了。 老实说,松哥之前也有过类似的经历,今天就来和小伙伴们聊聊回头草到底吃不吃。 首先一个基本观点,就是离职了也没必要和老东家弄的苦...

男生更看重女生的身材脸蛋,还是思想?

往往,我们看不进去大段大段的逻辑。深刻的哲理,往往短而精悍,一阵见血。问:产品经理挺漂亮的,有点心动,但不知道合不合得来。男生更看重女生的身材脸蛋,还是...

什么时候跳槽,为什么离职,你想好了么?

都是出来打工的,多为自己着想

程序员为什么千万不要瞎努力?

本文作者用对比非常鲜明的两个开发团队的故事,讲解了敏捷开发之道 —— 如果你的团队缺乏统一标准的环境,那么即使勤劳努力,不仅会极其耗时而且成果甚微,使用...

为什么程序员做外包会被瞧不起?

二哥,有个事想询问下您的意见,您觉得应届生值得去外包吗?公司虽然挺大的,中xx,但待遇感觉挺低,马上要报到,挺纠结的。

当HR压你价,说你只值7K,你该怎么回答?

当HR压你价,说你只值7K时,你可以流畅地回答,记住,是流畅,不能犹豫。 礼貌地说:“7K是吗?了解了。嗯~其实我对贵司的面试官印象很好。只不过,现在我的手头上已经有一份11K的offer。来面试,主要也是自己对贵司挺有兴趣的,所以过来看看……”(未完) 这段话主要是陪HR互诈的同时,从公司兴趣,公司职员印象上,都给予对方正面的肯定,既能提升HR的好感度,又能让谈判气氛融洽,为后面的发挥留足空间。...

面试:第十六章:Java中级开发(16k)

HashMap底层实现原理,红黑树,B+树,B树的结构原理 Spring的AOP和IOC是什么?它们常见的使用场景有哪些?Spring事务,事务的属性,传播行为,数据库隔离级别 Spring和SpringMVC,MyBatis以及SpringBoot的注解分别有哪些?SpringMVC的工作原理,SpringBoot框架的优点,MyBatis框架的优点 SpringCould组件有哪些,他们...

面试阿里p7,被按在地上摩擦,鬼知道我经历了什么?

面试阿里p7被问到的问题(当时我只知道第一个):@Conditional是做什么的?@Conditional多个条件是什么逻辑关系?条件判断在什么时候执...

终于懂了TCP和UDP协议区别

终于懂了TCP和UDP协议区别

立即提问
相关内容推荐