CODEWITHSUNDEEP
javascriptjqueryonclickhref
Java Questions
Java Questions

Reputation: 7953

how to create onclick for a link

i have a div for which i set value dynamically during run time, if there is value than i have enable or create a link which will have onclick method where i will call a javascript method.

how to do this in jquery or javascript?

I set value to a div like the following,

document.getElementById('attachmentName').innerHTML=projectInforamtionMap.Cim_AttachmentNames;

this the div :

<tr>
  <td align="left"><div id="attachmentName"> </div></td>
</tr>

Kindly help me to find and fix.

Best Regards

Upvotes: 7

Views: 30330

Answers (7)

civilator
civilator

Reputation: 119

as i was converting a classical asp details page to a one-page ajaxified page, i converted the existing links in the page to get the details loaded in the DIV in the same page. i renamed the href tag to dtlLink and got that data in the jquery load() function.

detail.asp (server.urlencode is added and required here )

<a href=""#"" onclick=""javascript:LoadDetails(this)"" dtllink="detail.asp?x=" & Server.URLEncode(Request("x"))&y=" & Server.URLEncode(Request("y")) > link text </a>

parent.asp (it has some extra code for holdon.js spinner image, button enable/disable, results div show/hide) Jquery 

 function LoadDetails(href) {
 //get the hyperlink element's attribute and load it to the results div.
            var a_href = $(href).attr('dtllink');
            console.log(a_href);
            $('#divResults').html('');



            DisplayHoldOn();
            $('#divResults').load(a_href, function (response, status, xhr) {
                $('#divCriteria').hide();

                HoldOn.close();
                if (status == "error") {
                    var msg = "There was an error: ";
                    $("#divResults").html(msg + xhr.status + " " + xhr.statusText);
                    $('#divCriteria').show();
                    $("#cmdSubmit").removeAttr('disabled');
                }
            });
        }

Upvotes: 0

albertoblaz
albertoblaz

Reputation: 590

You have several alternatives

JavaScript:

// var elem = document.getElementById('attachmentName');
elem.onclick = function() {};
elem.setAttribute('onclick','foo()');
elem.addEventListener('onclick', foo, false); // The most appropiate way

jQuery:

// var elem = $('#attachmentName');
elem.click(foo);
elem.on('click', foo);
$('body').on('click', elem, foo);

Between the 3 jQuery alternatives, the last is the best one. The reason is due to the fact that you are attaching an event just the body element. In this case, it does not matter but in other cases, you are probably willing to attach the same event to a collection of elements, not just one.

Therefore, using this approach, the event is attached to the body but works for the elements clicked, instead of attaching the same event to every element, so it's more efficient :)

Upvotes: 2

K D
K D

Reputation: 5989

You can do this without inserting link in the div in following way

document.getElementById("attachmentName").onClick = function () {
                                                                  alert(1); // To test the click
                                                                 };

You can achieve it with the help of jQuery as well in the following way.

$("#attachmentName").click(function () 
                                        {
                                             alert(1);
                                        });

for this you have to include jQuery liabray on the page. refer jQuery.com

Still if you forecefully want to include the link in Div then following is the code for it

var link = $("<a>"+ $("#attachmentName").text() +"</a>");
$("#attachmentName").html($(link);
link.click(function () {
                          alert(1);
                        });

Hope this would help.

Upvotes: 1

Dineshkani
Dineshkani

Reputation: 3015

Assume that your function are previously define like this

function foo(){alert('function call');}

After adding innerHTML

In Javascript

document.getElementById('attachmentName').setAttribute('onclick','foo()');

In Jquery

$("#attachmentName").attr('onclick','foo()');

Upvotes: 2

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100195

jquery way:

$("#attachmentName").click(function() {
  some_js_method();
});

Upvotes: 1

EnterJQ
EnterJQ

Reputation: 1014

$('#attachmentName').click(function(){
     //do your stuff 
})

Upvotes: 1

Jefferson Henrique C. Soares
Jefferson Henrique C. Soares

Reputation: 968

You can set a onclick function:

document.getElementById('attachmentName').onclick = function() {};

Upvotes: 8

Related Questions