JavaScript - Createelement Ie Issue

I'm trying to check to see if a dynamically created element exists BEFORE creating another element of the same exact type...but my if statement at the beginning is not working and another element is just created.

Code:

function writeElement(id) {
	if(document.getElementsByTagName('transElement')[0]) {
		var id = id;
		killElement();
		writeElement(id);
	}
	var id = id;
	var transElement = document.createElement('transElement');
	var solidElement = document.createElement('solidElement');
	var closeElement = document.createElement('closeElement');
	//transElement.id = "transElement";
	transElement.setAttribute('id', 'transElement');
	solidElement.setAttribute('id', 'solidElement');
	closeElement.setAttribute('id', 'closeElement');
	closeElement.setAttribute('onClick', 'killElement()');
	closeElement.innerHTML = "Close";
	var content =  "inject_poem.php?id=" + id;
	getdata(content, 'solidElement');
	document.body.appendChild(transElement);
	document.body.appendChild(solidElement);
	document.body.appendChild(closeElement);
}

Does anyone know what is incorrect about my if statement?

Please delete, someone had a retard moment

I have the following sample html file (attached). I am trying to display the calculated field using javascript and I created a function (I am a newbie) to do so. However, it persistently shows NaN instead of the required number. I have tried my best over a coupla hours racking my brains and the internet as to why it shows as not a number.
I will appreciate any help.
Thanks,

Freaking IE. Must die. Really it must.

Unfortunately, I have to code for it, and I can't figure out what went wrong he

http://wyqued-design.com/dev/skyview/index.html

The navigation, and layout, breaks in IE 7. Any ideas?

-Emilie

I can't seem to play MP3s with jPlayer, only OGG.
Any ideas? My custom code is below:

Code:

<script type="text/javascript">
//<![CDATA[
var audioPlaylist;
var Playlist;
jQuery(document).ready(function(){

    Playlist = function(instance, playlist, options) {
        var self = this;

        this.instance = instance; // String: To associate specific HTML with this playlist
        this.playlist = playlist; // Array of Objects: The playlist
        this.options = options; // Object: The jPlayer constructor options for this playlist

        this.current = 0;

        this.cssId = {
            jPlayer: "jquery_jplayer_",
            interface: "jp_interface_",
            playlist: "jp_playlist_"
        };
        this.cssSelector = {};

        jQuery.each(this.cssId, function(entity, id) {
            self.cssSelector[entity] = "#" + id + self.instance;
        });

        if(!this.options.cssSelectorAncestor) {
            this.options.cssSelectorAncestor = this.cssSelector.interface;
        }

        jQuery(this.cssSelector.jPlayer).jPlayer(this.options);

        jQuery(this.cssSelector.interface + " .jp-previous").click(function() {
            self.playlistPrev();
            jQuery(this).blur();
            return false;
        });

        jQuery(this.cssSelector.interface + " .jp-next").click(function() {
            self.playlistNext();
            jQuery(this).blur();
            return false;
        });
    };

    Playlist.prototype = {
        displayPlaylist: function() {
            var self = this;
            jQuery(this.cssSelector.playlist + " ul").empty();
            for (i=0; i < this.playlist.length; i++) {
                var listItem = (i === this.playlist.length-1) ? "<li class='jp-playlist-last'>" : "<li>";
                listItem += "<a href='#' id='" + this.cssId.playlist + this.instance + "_item_" + i +"' tabindex='1'>"+ this.playlist[i].name +"</a>";

                // Create links to free media
                if(this.playlist[i].free) {
                    var first = true;
                    listItem += "<div class='jp-free-media'>(";
                    jQuery.each(this.playlist[i], function(property,value) {
                        if(jQuery.jPlayer.prototype.format[property]) { // Check property is a media format.
                            if(first) {
                                first = false;
                            } else {
                                listItem += " | ";
                            }
                            listItem += "<a id='" + self.cssId.playlist + self.instance + "_item_" + i + "_" + property + "' href='" + value + "' tabindex='1'>" + property + "</a>";
                        }
                    });
                    listItem += ")</span>";
                }

                listItem += "</li>";

                // Associate playlist items with their media
                jQuery(this.cssSelector.playlist + " ul").append(listItem);
                jQuery(this.cssSelector.playlist + "_item_" + i).data("index", i).click(function() {
                    var index = jQuery(this).data("index");
                    if(self.current !== index) {
                        self.playlistChange(index);
                    } else {
                        jQuery(self.cssSelector.jPlayer).jPlayer("play");
                    }
                    $(this).blur();
                    return false;
                });

                // Disable free media links to force access via right click
                if(this.playlist[i].free) {
                    jQuery.each(this.playlist[i], function(property,value) {
                        if(jQuery.jPlayer.prototype.format[property]) { // Check property is a media format.
                            jQuery(self.cssSelector.playlist + "_item_" + i + "_" + property).data("index", i).click(function() {
                                var index = $(this).data("index");
                                jQuery(self.cssSelector.playlist + "_item_" + index).click();
                                jQuery(this).blur();
                                return false;
                            });
                        }
                    });
                }
            }
        },
        playlistInit: function(autoplay) {
            if(autoplay) {
                this.playlistChange(this.current);
            } else {
                this.playlistConfig(this.current);
            }
        },
        playlistConfig: function(index) {
            jQuery(this.cssSelector.playlist + "_item_" + this.current).removeClass("jp-playlist-current").parent().removeClass("jp-playlist-current");
            jQuery(this.cssSelector.playlist + "_item_" + index).addClass("jp-playlist-current").parent().addClass("jp-playlist-current");
            this.current = index;
            jQuery(this.cssSelector.jPlayer).jPlayer("setMedia", this.playlist[this.current]);
        },
        playlistChange: function(index) {
            this.playlistConfig(index);
            jQuery(this.cssSelector.jPlayer).jPlayer("play");
        },
        playlistNext: function() {
            var index = (this.current + 1 < this.playlist.length) ? this.current + 1 : 0;
            this.playlistChange(index);
        },
        playlistPrev: function() {
            var index = (this.current - 1 >= 0) ? this.current - 1 : this.playlist.length - 1;
            this.playlistChange(index);
        },
        supplied: "mp3",
        addMedia: function(media){
            this.playlist.push(media);
            this.playlistNext();
        }
    };

});

var last_el='';
jQuery('.track .wrap .play').click(function(){
    var cur_img = jQuery(this).css('backgroundImage');
    if(cur_img.substring(cur_img.length-10)=='play.png")'){
        if(last_el!=''){
            last_el.css('background-image','url("img/play.png")');
        }
        var el = jQuery(this);
        last_el = el;
        parent.frames[1].addSong(el.attr("title"),el.attr("mp3"),el.attr("ogg"));
        el.css('background-image','url("img/pause.png")');
    }else{
        parent.frames[1].pauseSong();
    }
});
jQuery('.jp-interface .jp-pause').click(function(){
    last_el.css('background-image','url("img/play.png")');
});
jQuery('body a').click(function(){
    var el = jQuery(this);
    var href = el.attr('href');
    if(href.substring(0,1)=='/'){
        parent.location.href = parent.location.href + href.substring(1,href.length);
    }    
});

//]]>
</script>

I have the Jplayer.swf in multiple folders too to prevent path errors, but that still seems to not help. Anybody?

Hi guys! I'm trying to make a div layer (id "tehz") fade in using Java. Problem is, it doesn't go through the animation, it just skips to the last stage. If I put an alert to show me the value of "cat" at every step it works just fine. Can anyone please tell me what's the matter?

Code:

function vis(cat) {
if(cat<=90) {
	    // alert(cat)
            document.getElementById("tehz").style.opacity=cat/100;
	    document.getElementById("tehz").style.filter="alpha(opacity="+cat+")"
	    cat=cat*1+1
	    setTimeout(vis(cat),1000);
	    }
}

I'm developing a FlashCard App for Mozilla based browsers, and i seem to be having a strange problem. When i goto write the data file, it for some reason is not writing the CR and LF. In the datafile i'm just getting one long string of data.
Hopefully i can get this app functional by today. I want to get back to studying chinese while i'm bussing to work

Code:

<html>
<head>
<script language="javascript">
// Set Global Variables

var Know = 0;
var DontKnow = 0;
var CurrentCard = 0;
var ChineseCard = new Array();
var PinYinCard = new Array();
var EnglishCard = new Array();
var NumberOfCards = 0;
var DataFile = "C:" + String.fromCharCode(92) + "FlashCard.txt";
var Delimeter = ",";
var EndOfRecordTerminationCharacter = ".";

function init()
{
 document.getElementById("FlashCardPlayer").style.visibility = "hidden";
 document.getElementById("FlashCardEditor").style.visibility = "hidden";
 document.getElementById("MainMenu").style.visibility = "visible";
}

function ShowPlayer()
{
 document.getElementById("FlashCardPlayer").style.visibility = "visible";
 document.getElementById("MainMenu").style.visibility = "hidden";
 document.getElementById("FlashCardEditor").style.visibility = "hidden";
 LoadFlashCard();
}

function ShowEditor()
{
 document.getElementById("FlashCardEditor").style.visibility = "visible";
 document.getElementById("FlashCardPlayer").style.visibility = "hidden";
 document.getElementById("MainMenu").style.visibility = "hidden";
}

function ShowMain()
{
 document.getElementById("MainMenu").style.visibility = "visible";
 document.getElementById("FlashCardPlayer").style.visibility = "hidden";
 document.getElementById("FlashCardEditor").style.visibility = "hidden";
}

function btnClickShowPinYin()
{
 document.getElementById("PinYin").value = PinYinCard[CurrentCard];
}


function btnClickShowEnglish()
{
 document.getElementById("English").value = EnglishCard[CurrentCard];
}

function ClearEditor()
{
 // Clear all the text boxes in the editor
 document.getElementById("EditChinese").value = "";
 document.getElementById("EditPinYin").value = "";
 document.getElementById("EditEnglish").value = "";
}

function WriteData()
{
 // Conicate the Record data
 var WriteData = document.getElementById("EditChinese").value  + Delimeter + 
 document.getElementById("EditPinYin").value  + Delimeter +
 document.getElementById("EditEnglish").value + EndOfRecordTerminationCharacter + "\n";
 
  // Load the data file's current contents
 var OldData = LoadFromDisk(DataFile);
 
 var AppendData = OldData + WriteData + "\n";
 
 // Write the data to the file
 SaveToDisk(DataFile, AppendData);
 
 // Clear the TextBoxes to prepare for the next entry
 ClearEditor();
}

 var Records = new Array();
 var Elements = new Array();
  
function LoadFlashCard()
{
 // Load the FlashCard Information from the DataFile into the Arrays
 LoadData = LoadFromDisk(DataFile);
 
 // Loop through the  String and record the locations of the delimeters
   
 // Split the data string into records

 Records = LoadData.split(".");
 
 // Split the Records into Elements

  
 for (var x = 0; x <= Records.length; x++)
     {
	  Elements = Records[x].split(",");

	 }
	 

	 
 // Load the Elements in to the   ChineseText, PinYin, and English   Arrays
 
 NumberOfCards = 3 / Elements.length;
 
 // Load the Chinese Characters             "12, 123, 1234, 12345, 123456, 1234567
 var Ptr = 0;
  for (var x = 0; x < Records.length; x = x + 3)
     {
	  ChineseCard[Ptr] = Elements[x];
	  Ptr++;
	 }
	 
 Ptr = 0;
 // Load the PinYin
  for (var x = 1; x < Records.length; x = x + 3)
     {
	  PinYinCard[Ptr] = Elements[x];
	  Ptr++;
	 }
	 
 Ptr = 0;
 // Load the English
  for (var x = 2; x < Records.length; x = x + 3)
     {
	  EnglishCard[Ptr] = Elements[x];
	  Ptr++;
	 }

}

function btnClickKnow()
{
Know = Know + 1;

     if(CurrentCard == NumberOfCards)
       {
         // Display the score
         alert("You scored " + Know + " out of " + NumberOfCards);
         CurrentCard = 0;
         Know = 0;
         DontKnow = 0;
         // clear all textboxes and put index(0) chinese character into the chinese character textbox
         
       }
CurrentCard = CurrentCard + 1;

document.getElementById("PinYin").value = "";
document.getElementById("English").value = "";
document.getElementById("ChineseCharacter").value = ChineseCard[CurrentCard];
}


function btnClickDontKnow()
{
DontKnow = DontKnow + 1
   if(CurrentCard == NumberOfCards)
       {
         // Display the score
         alert("You scored " + Know + " out of " + NumberOfCards);
         CurrentCard = 0;
         Know = 0;
         DontKnow = 0;
         // clear all textboxes and put index(0) chinese character into the chinese character textbox
       }
CurrentCard = CurrentCard + 1;

document.getElementById("PinYin").value = "";
document.getElementById("English").value = "";
document.getElementById("ChineseCharacter").value  = ChineseCard[CurrentCard];
}

function SaveToDisk(FileName, Content)
{
	try {
		netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
	} catch (e) {
		alert("Permission to save file was denied.");
	}
	var file = Components.classes["@mozilla.org/file/local;1"]
		.createInstance(Components.interfaces.nsILocalFile);
	file.initWithPath( FileName );
	if ( file.exists() == false ) {
		file.create( Components.interfaces.nsIFile.NORMAL_FILE_TYPE, 420 );
	}
	var outputStream = Components.classes["@mozilla.org/network/file-output-stream;1"]
		.createInstance( Components.interfaces.nsIFileOutputStream );

	outputStream.init( file, 0x04 | 0x08 | 0x20, 420, 0 );
	var output = Content;
	var result = outputStream.write( output, output.length );
	outputStream.close();
}

function LoadFromDisk(filePath)
{
 if(window.Components)
   try
   {
    netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
    var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
    file.initWithPath(filePath);
    if (!file.exists())
    return(null);
    var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream);
    inputStream.init(file, 0x01, 00004, null);
    var sInputStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream);
    sInputStream.init(inputStream);
    return(sInputStream.read(sInputStream.available()));
   }
   catch(e)
   {
    //alert("Exception while attempting to load\n\n" + e);
    return(false);
   }
return(null);
}

</script>
</head>
<body onload="init()">

<!-- 
*****************************************
Flash Card Player
*****************************************
-->
<div id="FlashCardPlayer" style="position: absolute; left: 0px; top: 0px;" >

<input id="ChineseCharacter" type="textbox" style="position: absolute; left: 75px; top: 5px; width: 100px; height: 100px; font-size: 35px;">
<input id="PinYin" type="textbox" style="position: absolute; left: 5px; top: 110px; width: 225px;" >
<input id="English" type="textbox" style="position: absolute; left: 5px; top: 135px; width: 225px;">
<input type="button" value="Know" style="position: absolute; left: 5px; top: 170px; width: 100px; height: 30px;" onclick="btnClickKnow();">
<input type="button" value="Dont Know" style="position: absolute; left: 125px; top: 170px; width: 100px; height: 30px;" onclick="btnClickDontKnow();">
<input type="button" value="PinYin" style="position: absolute; left: 5px; top: 210px; width: 100px; height: 30px;" onclick="btnClickShowPinYin();">
<input type="button" value="English" style="position: absolute; left: 125px; top: 210px; width: 100px; height: 30px;" onclick="btnClickShowEnglish();">

<a href="" style="position: absolute; left:10px; top: 245px;" onclick="ShowMain();">Home</a>
<TextArea id="DataArea" style="visibility: hidden;"></TextArea>
</div>


<!-- 
******************************************
Flashcard Editor
******************************************
-->
<div id="FlashCardEditor" style="position: absolute; left: 0px; top: 0px;">

<input id="EditChinese" style="position: absolute; left: 75px; top: 5px; width: 100px; height: 100px; font-size: 35px;" type="textbox">
<input id="EditPinYin" style="position:absolute; left: 5px; top: 110px; width: 225px;" type="textbox">
<input id="EditEnglish" style="position:absolute; left: 5px; top: 135px; width: 225px;" type="textbox">

<input id="EditClearTextButton" value="Clear" style="position:absolute; left: 5px; top: 180px; width: 100px; height: 30px;" onclick="ClearEditor();" type="button">
<input name="EditOKButton" value="OK" style="position: absolute; left: 125px; top: 180px; width: 100px; height: 30px;" onclick="WriteData();" type="button">


<a href="" style="position: absolute; left:10px; top: 225px;" onclick="javascript:Alert("*sigh* i'm getting to it!");">New</a>
<a href="" style="position: absolute; left:10px; top: 245px;" onclick="btnClickShowMain();">Home</a>
</div>
<!-- 
******************************************
Define the Layer for the Main menu
******************************************
-->

<div id="MainMenu" style="position: absolute; left: 0px; top: 0px;">
These are the instructions for the Flashcard App. In the future, there should be a score board and a selection of word lists and other such things. However, it's blank for now until i finish this app :)

<input value="Study Flashcards" style="position: absolute; left: 50px; top: 170px; width: 120px; height: 30px;" onclick="javascript:ShowPlayer();" type="button">
<input value="Edit Flashcards" style="position: absolute; left: 50px; top: 210px; width: 120px; height: 30px;" onclick="ShowEditor();" type="button">
</div>

</body>
</html>

Does anyone know why Lightbox images would be displaying in reverse order? The numbers are correct but it pops up on the last one and I have to hit previous to get to the front.

This issue is right at the cross point between the java and javascript. Basically, I want to DYNAMICALLY pass some Cyrillic characters (such as Алла Пугачева) at the runtime to the javascript function, as following:

Current text encoding setting is Cp1252 in JAVA IDE.

response.getOutputStream().println("<script>test('" + testCoding +"');</script>");

If the testCoding is normal latin chracter (such as "abc, xyz"), this will work, so that at the runtime, it will execute the funciton test(param) and passing the parameter, "abc, xyz" to the javascript function test(param).

The frontend javascript function test(param) will further display it as: field.innerHTML = param;


But if it is the Cyrillic characters (such as Алла Пугачева), it won't work.

The "Алла Пугачева" will be passed as the garbage character and displayed as so.

How can I in the java class DYNAMICALLY set up the encoding so that the sysytem at the runtime will acccept the Cyrillic characters. I would believe I need to setup such ancoding as UTF-8. But I do not know how to? OR,

How can I process the Cyrillic characters (such as Алла Пугачева), in the javascript function so that it can be displayed properly?


Thanks


Scott

Code:

<html>

<script>

function doit(){
document.write(document.getElementById('myIMG').getAttribute('src'));
}

</script>

<body onLoad="doit()">

<img src="blabla.jpg" id="myIMG">

My question is, why is it, that after loading the page, the image that should be displayed at the page is not being displayed. The only thing that can be seen is text generated by the document.write function.

I am having an issue with a variable I am getting from a javascript function. Randomly it will appear to find the height of the image I told it to find to be 0, which to me doesn't make sense. The code is meant to pull the size of the main image, then set navigation arrows to either side at the right height. The Function is first with the call of the function later. I left out the url, but otherwise, this is the only code that would be used.

Any Help is greatly appreciated...

This is the function located in the header:
Code:

<script type="text/javascript">
	function arrowHeight(a){
		var img = new Image();
		img.src = a;
		var divh = img.height;
		var calc = (divh/2)-25;
	
		return calc;
	}
</script>

This is the code called later in the code:
Code:

<script language="javascript">
	var a = arrowHeight(".../img0001.jpg");
	document.write ("<a href='.../img0010.php'><img src='.../left.png' style = 'position: relative; right: 20px; bottom: " + a + "px;'/></a>");
	document.write ("<img src=.../img0001.jpg' />");
	document.write ("<a href='.../img0002.php'><img src='.../right.png' style = 'position: relative; left: 20px; bottom: " + a + "px;'/></a>");
</script>

Hello,

I've got a strange image with mouse overs on a menu.


my code;
Code:

function SwapImage(strName,strImage){
	ImageFlip= new Image()
	ImageFlip.src = "images/" + strImage;
	var strImageOn = document.getElementById(strName);
	strImageOn.src = ImageFlip.src; return true;
}

<table border='0' cellpadding='5' cellspacing='5'>

<tr>
<td width='33' onMouseOver=\"SwapImage('MenuItem1','MouseOver.png');\" onMouseOut=\"SwapImage('MenuItem1','MouseOut.png');\"><a href='/'><img src='images/home_btn.png' border='0' /></a></td>
<td width='11'><img src='images/MouseOut.png' border='0' id='MenuItem1' /></td>
</tr>

<tr>
<td width='33' onMouseOver=\"SwapImage('MenuItem2','MouseOver.png');\" onMouseOut=\"SwapImage('MenuItem2','MouseOut.png');\"><a href='/artwork.php'><img src='images/artwork_btn.png' border='0' /></a></td>
<td width='11'><img src='images/MouseOut.png' border='0' id='MenuItem2' /></td>
</tr>

<tr>
<td width='33' onMouseOver=\"SwapImage('MenuItem3','MouseOver.png');\" onMouseOut=\"SwapImage('MenuItem3','MouseOut.png');\"><a href='/artists.php'><img src='images/artists_btn.png' border='0' /></a></td>
<td width='11'><img src='images/MouseOut.png' border='0' id='MenuItem3' /></td>
</tr>

<tr>
<td width='33' onMouseOver=\"SwapImage('MenuItem4','MouseOver.png');\" onMouseOut=\"SwapImage('MenuItem4','MouseOut.png');\"><a href='/about.php'><img src='images/about_btn.png' border='0' /></a></td>
<td width='11'><img src='images/MouseOut.png' border='0' id='MenuItem4' /></td>
</tr>

<tr>
<td width='33' onMouseOver=\"SwapImage('MenuItem5','MouseOver.png');\" onMouseOut=\"SwapImage('MenuItem5','MouseOut.png');\"><a href='/links.php'><img src='images/links_btn.png' border='0' /></a></td>
<td width='11'><img src='images/MouseOut.png' border='0' id='MenuItem5' /></td>
</tr>

</table>

this is in a php page, thats the reason for the extra slashes/espaces.
for some reason, only the last row of the menu works with the mouse over, maybe I'm missing something, but it seems like it should all work.

any ideas would be really helpful.

cheers,
-Ken

Hello

I have some JS email validation which does not appear to be working.

I originally had a form and decided to add validation to it, so I am adding JS to that original file.

My original form used this:

Code:

<form action="form_script.asp" method="POST" enctype="multipart/form-data" onSubmit="return onSubmitForm();">

and the validation script uses this:

Code:

<form name="theform" method="post" action="#" onSubmit="return check(this);">

I am trying to get them both to work.

How would I do that, please?

The test site is he http://proofreading4students.com/contact_test.asp

Thanks for any help.

Steve