首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

jquery触发异常

2014-01-12 
jquery触发错误!doctype htmlhtmlheadmeta charsetgb2312title/titlescript srcjs/jque

jquery触发错误

<!doctype html>
<html>
<head>
<meta charset="gb2312">

<title></title>
<script src="js/jquery-1.10.2.js" type="application/javascript"></script>
<script src="js/common.js" type="application/javascript"></script>


</head>

<body>



<canvas width="1920" height="500" id="myCanvas" class="title_01">
不好意思你的浏览器不支持html5 请使用谷歌浏览器或者火狐浏览器
</canvas>









<select id="select_hai" name="select">
 <option value="1" selected="selected">1</option>
 <option value="2">2</option>

 <option value="3" >3</option>
</select>

</body>
</html>



// JavaScript Document

  xiaoguo_1();
$(document).ready(function(){  
  
   // jQuery methods go here... 

   

  $('.title_01').click(function () { 
      $('.tcc').css("visibility","visible");
    })

   $('.comfire1').click(function () { 
    var getinput=$('#gettitle').val();
      xiaoguo_1("ggge");
  $('.tcc').css("visibility","hidden");
    })
 })
 
 
 
 $(document).ready(function(){  
  
   // jQuery methods go here... 

   
  
  $('.title_02').click(function () { 
      $('.tcc').css("visibility","visible");
    })

   $('.comfire2').click(function () { 
    var getinput=$('#gettitle').val();
      xiaoguo_2("fwe");
  $('.tcc').css("visibility","hidden");
    })
 })
 
 
 
 /*选择海报*/

 $(document).ready(function(){  
 $('#select_hai').change(function () {
 
  var select_haibaos=$('#select_hai').val();
  switch (select_haibaos)
  {
  case '1':
  xiaoguo_1();
  break;
  case '2':
  xiaoguo_2();
  break;
  }

  });
 })
 
 
 
 
 
 
 
 
 
  function xiaoguo_1(wenzi)
 {

  if(!arguments[0]) wenzi = "123";
 
  $(document).ready(function(){  
    $('#myCanvas').removeClass();
 $('#comfire').removeClass();
$('#myCanvas').addClass("title_01");

$('#comfire').addClass("comfire1");

/* var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");


var img= new Image();

img.src="images/bigbanner.jpg";

img.onload = function () //确保图片已经加载完毕  
{
ctx.drawImage(img,0,0);
ctx.font="20px Baroque Script";
ctx.fillText(wenzi,500,50);

ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.fillStyle=gradient;
ctx.fillText("w3school.com.cn",10,90);

}*/




 /*测试画布导出*/
  /*$('.daochu').click(function () { 
     var img_png_src = c.toDataURL("image/png"); 
     $('#image_png').attr('src', img_png_src); 
 $(function() {
 $.ajax({
       type: "POST",
//        url: "index.php",
        data: {location:img_png_src},
        success: function(msg){
         alert( "Data Saved: " + msg );
           }
      });
});

 

    })*/


 })
 
 
 }
 
 
 
  function xiaoguo_2(wenzi)
 {

  if(!arguments[0]) wenzi = "123";
 
  $(document).ready(function(){  
  $('#myCanvas').removeClass();
 $('#comfire').removeClass();
$('#myCanvas').addClass("title_02");
$('#comfire').addClass("comfire2");



/* var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");


var img= new Image();



img.src="images/bigbanner2.jpg";
img.onload = function () //确保图片已经加载完毕  
{
ctx.drawImage(img,0,0);





ctx.font="20px Baroque Script";
ctx.fillText(wenzi,500,50);

ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.fillStyle=gradient;
ctx.fillText("w3school.com.cn",10,90);
}*/
 /*测试画布导出*/
 /* $('.daochu').click(function () { 
     var img_png_src = c.toDataURL("image/png"); 
     $('#image_png').attr('src', img_png_src); 
 $(function() {
 $.ajax({
       type: "POST",
//        url: "index.php",
        data: {location:img_png_src},
        success: function(msg){
         alert( "Data Saved: " + msg );
           }
      });
});

 

    })*/


 
 
 
 
 
 
 
 
 
 
 
 
 
 })
 
 
 }



我下拉菜单选择2后 画布的class明显改成了title_02  然后点击画布 为什么触发不是
  $('.title_02').click(function () { 
      $('.tcc').css("visibility","visible");
    })



而是触发了
$('.title_01').click(function () { 
      $('.tcc').css("visibility","visible");
    })


 。。。这个为什么
[解决办法]
本帖最后由 showbo 于 2014-01-09 11:46:58 编辑 你要移除之前绑定的事件,要不会继续增加click事件

你那个直接给canvas绑定一个事件,判断下canvas当前class是什么不就行了,写那么多代码干嘛。。


这个代码看的蛋痛,一点思路都没有

热点排行