1

There is a html page like this:

<div id="list"><a onclick = "javascript:addplaylist('shv231a','1');" href="javascript:void(0);">+</a></div>
<div id="list"><a onclick = "javascript:addplaylist('jhr2a13','1');" href="javascript:void(0);">+</a></div>
<div id="list"><a onclick = "javascript:addplaylist('thy2b1k','1');" href="javascript:void(0);">+</a></div> 

There are javascript functions

 addplaylist('shv231a','1');
    addplaylist('jhr2a13','1');
    addplaylist('thy2b1k','1');

I want to change value '1' with '2' in javascript function (addplaylist) when user click this

<a id="make2" onclick="" href="javascript:void(0);">Change the value 2</a>

How can I do that with jquery?

0

3 Answers 3

2

The way to do this with jQuery is to move all of the Javascript code into a separate file or script block within the HTML. Any way which abstracts the display (HTML + CSS) from the behavior (Javascript)

This will require a bit of reworking of the HTML. In particular removing the duplicate id fields in favor of having id's be unique. Additionally removing the javascript references from the onclick handler.

<div id="list1"><a>+</a></div>
<div id="list2"><a>+</a></div>
<div id="list3"><a>+</a></div> 

Then with jQuery you can specify the behavior of these links directly from the JavaScript. This is true for both the play list links and the one which modifies them to pass '2',

$(document).ready(function () { 

  var secondArg = '1';

  $('#list1 a').click(function (e) { 
    addplaylist('shv231a1', secondArg);
    e.preventDefault();  // Don't follow link
  });

  $('#list2 a').click(function (e) { 
    addplaylist('jhr2a13', secondArg);
    e.preventDefault();  // Don't follow link
  });

  $('#list3 a').click(function (e) { 
    addplaylist('thy2b1k', secondArg);
    e.preventDefault();  // Don't follow link
  });

  $('#make2').click(function (e) {
    secondArg = '2';
    e.preventDefault();
  });

});
Sign up to request clarification or add additional context in comments.

Comments

0

This is a possible solution:

<a id="make2" onclick="javascript:changeToTwo();" href="javascript:void(0);">Change the value 2</a>

Javascript

function changeToTwo() {
    $('div#list a').each(function() {
        $(this).attr('onclick', $(this).attr('onclick').replace("'1'","'2'"));
    });
}

If I remember right ie will only select 1 element with the same id so you may want to consider moving it to a class selector

Comments

0

1) Ids should be unique on a page 2) use a class to select 3) keep your functional code out of the markup

HTML:

<div id="1" class="list"><a>+</a></div>
<div id="2" class="list"><a>+</a></div>
<div id="3" class="list"><a>+</a></div>

javascript:

$('.list').each(function ( index, element) {
    addplaylist(element.id);
});

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.