Question

38

button onclick bind event

rated 0 times [ 45] [ 7] / answers: 1 / hits: 27341 / 14 Years ago, tue, february 8, 2011, 12:00:00

In HTML, I have a button list. If user clicks a button,

doCommand function will be called.
The code is following,

<ul>

<li class=button1 onclick=doCommand('bold'); id=bold-button title=bold>B</li>

<li class=button2 onclick=doCommand('bold'); id=italic-button title=bold>I</li>

<li class=button3 onclick=doCommand('bold'); id=underline-button title=bold>U</li>

<li class=button4 onclick=doCommand('bold'); id=strikethrough-button title=bold>S</li>

</ul>

This is plain expression, normal web programmer will code like that.
But, I want to hide onclick event and its function for security reason.
So the HTML code will be like this,

<ul>

<li class=button1 id=bold-button title=bold>B</li>

<li class=button2 id=italic-button title=bold>I</li>

<li class=button3 id=underline-button title=bold>U</li>

<li class=button4 id=strikethrough-button title=bold>S</li>

</ul>

Is there any efficient way to do this?
Hiding onclick property but do the same work.
I am using jQuery.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

clarkulisesa

Add To Favorites

Follow

Total Points: 422

Total Questions: 93

Total Answers: 112

Location: Austria

Member since Thu, Jan 7, 2021

3 Years ago

clarkulisesa questions

1 Google BigQuery Error: Syntax error: Illegal input character %

Fri, Sep 18, 20, 00:00, 4 Years ago

1 how to change state of a react component from another component

Mon, Jun 22, 20, 00:00, 4 Years ago

1 How to compare objects using lodash regardless on their order

Tue, Jun 16, 20, 00:00, 4 Years ago

1 How to listen sortChange(event) on Angular for ag-Grid?

Mon, Feb 24, 20, 00:00, 4 Years ago

1 Vue JS provide/inject and Props

Mon, Aug 12, 19, 00:00, 5 Years ago

View All

answered 14 Years ago deonkalvinw · Accepted Answer

if you set the same class for the btns, you could easily do:

markup:

<ul>

<li class=button1 clickable id=bold-button title=bold>B</li>

<li class=button2 clickable id=italic-button title=bold>I</li>

<li class=button3 clickable id=underline-button title=bold>U</li>

<li class=button4 clickable id=strikethrough-button title=bold>S</li>

</ul>

js:

$('.clickable').click(function(){/* doCommand('bold') or whatever */})

Edit: if you want on click to directly transform the text to bold, you could use the this (that refers to the element you clicked, and you need to wrap it inside jQuery $) keyword inside the function i.e.

$('.clickable').click(function(){$(this).css('font-weight','bold')})