I was wondering what is the simplest way of making just plain text act as a button (with minimal html). Text: <li class="indiv-nav" ><a target="_blank" href="/">About</a></li>

I need the text about to perform that of:

<div id="button"><input type="submit" value="Press me please!" /></div>

Sorry if this is a "stupid" question but, I'm still learning and I find it crazy how theres no "simpler" solution than those I found from googling.

I was wondering what is the simplest way of making just plain text act as a button (with minimal html). Text: <li class="indiv-nav" ><a target="_blank" href="/">About</a></li>

I need the text about to perform that of:

<div id="button"><input type="submit" value="Press me please!" /></div>

Sorry if this is a "stupid" question but, I'm still learning and I find it crazy how theres no "simpler" solution than those I found from googling.

• javascript
• html
• button

Share Improve this question Follow asked Sep 12, 2012 at 18:10 RoyRoy 3,28755 gold badges3131 silver badges4545 bronze badges 1

• yes as much jQuery as possible or css but preferably less HTML. – Roy Commented Sep 12, 2012 at 18:12

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 5

try

<a href="javascript: void(0)" id="button">Submit</a>

jQuery

$(function(){
    $("#button").bind("click",function(){
        $("#idOfYourForm").submit();  // consider idOfYourForm `id` of your form which you are going to submit
    });
});

JavaScript

document.getElementById("button").onclick = function(){
    document.getElementById("idOfYourForm").submit();
};

You could try something like this (without jQuery), but you'll need a form tag:

<form name="myform">
<span onclick="document.myform.submit();">submit this</span> 
</form>

depends on what you want to do on what solution you can use.

regular button:

$("li.indiv-nav a").click(function(){
          /* do something here*/
          window.location = 'about.html';
    });   

or submit form:

$("li.indiv-nav a").click(function(){
          $('#formid').submit();  
    });

check out a jsFiddle

form.submit()

You need to find a way to reference the form you want to submit, but once you have the form object, you can just call .submit() to submit it.

You can then add it as an onclick attribute, or bind it later, but this is basically what you want.

I am not sure what exactly you mean by act like a button but you can always style it using CSS. Just give it round corners and hover effects if that is what you mean. You can learn more here.

But if you mean you want to disable the link and do something else instead, you can do so using javascript. Just include a javascript file, and prevent the default action of the link. Like:

$(function(){
  $('a').click(function(event){
    event.preventDefault();
    //do what you want here
  }):
});

You could use CSS appearance attribute.

Set it to appearance:button; for your link.

Working Demo

OR

(Alternate) => Make button looks like a link