Tuesday 15 May 2012

javascript - Toggle effect problem when using for-loop in IE7 -


I am a web designer who is trying to hang on javascript and jquery, and I want to learn how to write less, a more concise code - to avoid ridicule by developers at work;)

I have this snippet:

  // checkbox checkbox $ ('. - Option-checkbox1'). Click (function () {$ ('product-optional-toggle1'). Toggle ('sharp');}); $ ('Product-optional-checkbox2'). Click (function () {$ ('product-optional-toggle2'). Toggle ('sharp');}); $ ('Product-optional-checkbox3'). Click (function () {$ ('Product-Optional-Toggle 3') Toggle ('Sharp');}); // hide divs $ ('product-optional-toggle1'). Hide (); Hide $ ('. Product-optional-toggle2'). Hide $ ('. Product-optional-toggle3').  

... which I want to reduce using for-loop, such as:

 for  (var i = 1; i & lt ; 4; ++ i) {$ ('product-optional-checkbox' + i). Click (function () {$ (this) .Parent ('div'). ('Div') Toggle ('sharp').;}); $ ('Product-optional-toggle' + i). Css ({display: 'none'}); };  

It works fine in FF, although it is toggled twice in IE 7. Does anyone know who is there to solve this kind of problem?

Going to parents, the descent is getting many divs?

In your example, you can change it:

  $ (this). Parent ('div'). 'Div') on current ('sharp')  

With the same code as the original example:

  $ ('product-optional-toggle' + i). Toggle ('sharp');  

However, it would be better to terminate all the numbers and just use the .product-optional-checkbox range. Thus you can add a click function to all elements of that category at a time and avoid the loop:

  $ ('product-optional-checkbox'). Click the stuff (function () {// $ (this)});  

No comments:

Post a Comment