I have this code, and it of course cannot show inside the php echo, because of the "" and ''. But I still want that effect, when you press the input the input value goes away, and that kind of thing. How can I do so? This is my code, that is bugging me:
<input name="navn" size="33" style="background-color: rgba(39, 36, 28, 0.8); border:none; height:45px; width:450px; color:#b5aa83; padding:15px; font-size:16px; font-weight:bold;" value="Navn" onblur="if (this.value == '') {this.value = 'Navn';}"
onfocus="if (this.value == 'Navn') {this.value = '';}"></div>
Misunderstood the question, disregard.
You should wrap your functions into an external JS file, your CSS also. It seems you're trying to create a placeholder, am I right? Maybe you should simply use HTML's "placeholder" attribute.
The input is not accessible unless you pass it to the function via "this" when using an external function. I'm not sure why your function does not recognize it when it's inline, but as external function with this passed as parameter, it works:
Javascript:
function onFocus(input){
console.log(input.value);
if(input.value === 'Navn'){
input.value = '';
}
console.log("On focus");
}
HTML:
<input name="navn" size="33" style="background-color: rgba(39, 36, 28, 0.8); border:none; height:45px; width:450px; color:#b5aa83; padding:15px; font-size:16px; font-weight:bold;" value="Navn" onblur="onBlur(this);" onfocus="onFocus(this);">
Simple Escape your quotes
echo "<input name=\"navn\" size=\"33\" style=\"background-color: rgba(39, 36, 28, 0.8); border:none; height:45px; width:450px; color:#b5aa83; padding:15px; font-size:16px; font-weight:bold;\" value=\"Navn\" onblur=\"if (this.value == '') {this.value = 'Navn';}\"
onfocus=\"if (this.value == 'Navn') {this.value = '';}\">";