开发者

How to execute a function using the value of a textbox Onclick of a DIV instead of a Onclick of a textbox

I have this function:

$("#border-radius").click(function(){   
var value = $("#border-radius").attr("value");
    $("div.editable").click(function (e) { 

       e.stopPropagation();

       showUser(value, '2'开发者_StackOverflow中文版, this.id)
       $(this).css({
          "-webkit-border-radius": value
       });  
    });                      
});

It reads the value of a textbox,

input type="text" id="border-radius" value="20px"

...and does a few things with it that are not relevant to my problem.

The textbox has the id="border-radius", and when it is clicked (and has a value) the function executes, as shown: $("#border-radius").click(function(){ ...do some stuff...

Basically, I want to be able to type a value into the textbox, and then click an object (submit button or div, preferably a div) and have it execute the function after: $("#border-radius").click(function(){ ...do some stuff... Instead of having to click the textbox itself

What can I add/change to enable this?


I think you need to identify the event target.

that you can do it by

event target property

example

$(document).ready(function() {
    $("#border-radius").click(function(event) {
        alert(event.target.id);
       //match target id and than proceed futher 
    });
});


Put the click handler on #my-button or whatever your button is.

$("#my-button").click(function(){
    var value = ... /* your original code */
});

It will still work because you are getting the value like $("#border-radius").attr("value"); and not $(this).attr("value");. So you all you need to change is which element you attach the click function to.

Alternatively, if you want to keep both handlers, you can just use it for both elements like this:

var commonHandler = function(){   
    var value = ... /* your original code */
};

$("#border-radius").click(commonHandler);
$("#my-button").click(commonHandler);

You can also trigger the click event of #border-radius, but this will execute all the event handlers attached on it:

$("#my-button").click(function () {
     $("#border-radius").click();
     // or $("#border-radius").trigger('click');
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜