CODEWITHSUNDEEP
javascriptjquerylivetyping
alexandru
alexandru

Reputation: 167

jquery live typing

To understand exactly what I'm talking about check out this link

So, I want to get rid of the input box, I mean to type something on a div with a red background for example and when I type google and press enter I want to send me to the google website and when I type yahoo to send me on the yahoo website. How I can achieve this? I'm not very good at javascript. Thanks!

Upvotes: 0

Views: 392

Answers (4)

Nimit Dudani
Nimit Dudani

Reputation: 4860

this may help.

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {

    $('div[contenteditable]').focus();
    $('div[contenteditable]').keypress(function (e) {
    if(e.which == 13) 
    {
       switch ($(this).html()) {
        case 'google':
            document.location = 'http://google.com'
            break;    
        case 'yahoo':
            document.location = 'http://yahoo.com'
            break;
          } 
    } 
    });

});
</script>
<style>
div[contenteditable] { background:red; width:200px;height:20px; padding:5px; }
</style>
</head>
<body>
<div contenteditable></div>
</body>
</html>

Upvotes: 2

Jayne Mast
Jayne Mast

Reputation: 1487

something like this?

http://jsfiddle.net/9mNc4/3/

Upvotes: 0

Przemek
Przemek

Reputation: 6700

You can also hide your input by css so it looks like you're writing in a div but really its just an approprietly styled input.

Your version with a little change

Upvotes: 0

Bas Slagter
Bas Slagter

Reputation: 9929

You can add a div to your page that has the CONTENTEDITABLE="true" attribute on it. Than add a button or whatsoever that indicated that the user is done (can also be an hit on the return key). At that point, check the value in the div, show an error message if needed or redirect the page if the entered value is valid (e.g. document.location.href = 'http://www.' + userValue + '.com';)

Upvotes: 0

Related Questions