第一次点击时不会跳转的功能

Question

我正在编写一个网页，其中包含一个允许用户选择图库以将图像与图像关联的字段。有些选项卡可以突出显示，而另一个页面上的php脚本正在加载可用库，但是我遇到的问题是，首先按钮仅在第二次点击后切换，这很奇怪，第二个我遇到的问题是，我不知道如何一次只切换一个按钮，所以基本上我只想让一个画廊一次关联，所以我不想让多个画廊在同时。我很坚持，所以任何帮助将不胜感激。我使用jQuery作为JavaScript框架。底部附近的功能并不完全相关，但我想我会包括它们。

var from_post = false; 
    var addOrRemove = true; 

    $(document).ready(function() { 

      $("#gallery").load('http://localhost/index.php/site/gallerys_avalible/ #gallerys_avalible', function() { 
      $('li').click(function(e) { 

      // console.log($('li').index((this))); 


      // e.preventDefault(); 

       $(this).toggle(
       function(){ 
        $(this).css('background-color', '#CC0000'); 
        console.log('backgroudn red'); 
       }, 
       function(){ 
        $(this).css('background-color', '#00A8F0'); 
          console.log('backgroudn blue'); 
       }); 


       return false; 
       }); 

      }); 

      /* $('li').live('click', function(e) { 

      }); 
     */ 
      $('#addNew').click(function() { 
       console.log('i got called'); 
       $('#new_form').fadeIn(1000); 
      }); 

      $('form').submit(function() { 

       if(from_post) { 
        //submit form 

        return true; 

       } else { 

        //dont submit form. 
        return false; 

       } 
      }); 

     }); 

谢谢谁花时间帮助我这个任何一个。

Answer 1

你有太多的功能在进行。

对于第二个问题：

document.onLoad(function(){ 
    $("#gallery").load('http://…'); 
    $("#gallery > li").toggle(function(){ 
     function(){$(this).css('background-color', '#CC0000');}, 
     function(){$(this).css('background-color', 'ORIGINAL_COLOUR');} 
    }); 
}); 

它可能是更好的添加/删除，而不是应用CSS类。要做到这一点：

document.onLoad(function(){ 
    $("#gallery").load('http://…'); 
    $("#gallery > li").click(function(){ 
     $("#gallery > li").toggleClass("active"); 
     //this will add .active if it's not there, or remove it if it's already there 
    }); 
}); 

这也会照顾到任何点击问题。

此外，还有jQuery :not()选择器，如果你想选择其他的东西。

Answer 2

您使用切换的方式，它不需要被封装在.click绑定中。这是事件本身。

此代码：

$('li').toggle(
function(){ 
    $(this).css('background-color', 'red'); 
}, 
function(){ 
    $(this).css('background-color', 'blue'); 
}); 

http://jsfiddle.net/MRNwT/1/

另外，我不认为切换是你想要的呢。你想要忽略所有的东西，然后重新点亮被点击的项目。

Answer 3

你为什么不干脆用.toggle

$('li').toggle(function() {   

       function(){ 
        $(this).css('background-color', '#CC0000'); 
        console.log('backgroudn red'); 
       }, 
       function(){ 
        $(this).css('background-color', '#00A8F0'); 
          console.log('backgroudn blue'); 
       });