We Keep Coding

Onclick feature over image

I am trying to make text appear when the user clicks on an image but cannt get it to work. could someone please help me i'm doing it using JavaScript.
Thanks

Here you go, and an example:
<img src='http://placehold.it/350x150' onclick='alert("Text appears...")'/>
Here's another example showing how you can do the alert and write text to a div, since the alert is of limited value. You can also just write to the div

Mikeb's code works if you are writing it in HTML. If you are using Javascript and have a reference to you element:
var imgElement = document.getElementByID('WhateverYouPutAsTheID') //or get ref some other way
imgElement.onclick = function() { alert('Message you want to display'); };
I hope this works for you!

Copying text from an element in jquery and inseting into another elelement

I am trying to create a simple js script that will copy text from a specified div element and paste it into the 'value' field of a form. This is the best I have managed to come up with:
var txt=$('div').clone();
$('#name').val(txt);
Can somebody please let me know where I am going wrong?
Thanks guys!

var txt=$('div .someclassname').text();
or var txt=$('div #someidname').text();
$('#name').val(txt);
it like that.

AJAX to show text that you type

I have a one textarea's on my page which is located on the left. On the right side I have a simple div.
The textarea will later become CKeditor. Now I would like to have it so that when I type something in the textarea, that it immediately displays the text I'm typing in the div.
I just notices that Stackoverflow uses exactly what I wish to have. While I write this question I get to see what it will look like below.
How exactly is this done? I've searched on Google and followed AJAX tutorials but I'm not getting tutorials that get me closer.
Thanks!

There's no AJAX in this situation. Just JavaScript processing. You set up a change event handler on the input item (textarea or other) and with JS you format that text and put the formated content inside another container.
AJAX would require server requests, while this is done entirely on the client side.

This does not relate to ajax. It's just a javascript challenge. First, you have to have a js function that handle the keydown event of the textarea, then you will change the text value (or html value) in the right div in responding to the keydown event. I think that you should learn more about javascript then jquery for easily solving this problem.

$('#text-area-id').keypress(function() { $('#div-id').html($(this).value()); });
this can probably help:)
if you are not using jquery then you can do this
create method which will be called on key press
function onChange(el)
{
document.getElementById('#div-id').innerHTML = el.innerText;
}
then attach event on your textarea
<textarea onkeyup="onChange(el);"></textarea>

Here is code from a recent quesiton that needed something similar. I'm guessing you know enough JS to modify it as per your needs.
$('#names').bind('keyup', function(){
var text = $(this).val();
var tokens = text.split(" ");
var output = "";
for(int i=0; i<tokens.length; i++){
output+= "<span>"+tokens[i]+"</span>&nbps;"; //note extra space at the end
}
$('#preview').innerHTML=output;
});
The original post is here.

Using jQuery
$(function(){
$("textarea").keyup(function(){
$("div").html($(this).val());
});
});
http://jsfiddle.net/bxf8x/

HIde word with JavaScript

I am not developer so I need help from you guys.
My Problem is simple.
I just want javascript to hide word before "."
Example :
say for google.com
I just want word ".com" tobe print.
Please note that my content is dynamic so google.com will keep changing everytime to google.net or yahoo.com...... so on..
Thanx in advanced.

Well, you didn't mention quite a lot, like how do you get your input? What to do if you have no dot, are many dots?
One simple solution is:
var s = 'before.after';
var pos = s.indexOf('.');
if(pos >= 0) // here, if I don't find a dot, keep s as it is.
s = s.slice(pos);
alert(s); // .after

Here's a tutorial for you on how to parse URL's in Javascript.
http://java-programming.suite101.com/article.cfm/how_to_get_url_parts_in_javascript

If the content you want to modify is in HTML content, the easiest way is to do string replace.
http://www.bradino.com/javascript/string-replace/
Before using replace, you should first locate the content, by its container ID or Name.
http://www.tizag.com/javascriptT/javascript-getelementbyid.php
http://www.eggheadcafe.com/community/aspnet/3/43154/getelementbyname.aspx
Hope this helps.

How to use JQuery to truncate the contents of option tags?

Please take a look here: http://www.binarymark.com/Products/FLVDownloader/order.aspx
What I am trying to do is to get rid of the prices inside the option tag. On that page you can see a drop-down box under Order Information, Product. I want to remove the prices from all the options that contain them in that box, so get rid of " - $75.98" for example. I am not used to JQuery, but I realize it would be possible - just not sure how to do it, so your help would be greatly appreciated.
Thanks.
George

Something like this should do the trick:
$('select[name="contractId"] > option').each(function ()
{
var $this = $(this);
$this.text($this.text().split(/\s-/)[0]);
});
That should split the text into an array with the "wanted" part as index 0, and set the text to whatever is contained in that index. You could also use a replace regex if you wanted to.
It would make more sense to do this server-side really, if a user has JS disabled on their machine you could run into problems with displaying incorrect prices.

Unfortunately based on your country of origin, Plimus is not allowed to continue this process. So I cant help you! :)
but this is the general idea:
if ($('#field > div.field-item:contains("someText")').length > 0) {
$("#somediv").addClass("thisClass");
}