IE6,7,8 this code dose not working
anybody help me.
how can i fix it??
<script type="text/javascript">
function call (event) {
if (document.createEventObject) { // IE before version 9
var mouseclickEvent = document.createEventObject (window.event);
mouseclickEvent.button = 1; // left button is down
document.getElementById("test4").fireEvent ("onclick", mousedownEvent);
}
}
</script>
<body>
<button id="test" onmouseover="call (event);">call</button>
<input id="test3" type="file" onclick="alert(6)"/>
</body>
There're several problems in you code:
event and window.event is redundant (and, I'm not sure though, may cause error);
There's no element with id test4.
The following code has been tested on IE8 and IE6:
<script>
function call()
{
if(document.createEventObject)
{
var evt=document.createEventObject();
evt.button=1;
document.getElementById("test").fireEvent("onclick",evt);
}
}
</script>
<button type="button" onclick="call();">Fire</button>
<input type="text" id="test" onclick="alert(6);" />
Related
I am learning Javascript.. Below code working only if my script tag below my input text element, but if i place code above input text tag, its not working. May I know why? Below is code:
<head>
</head>
<body>
<input type="text" id="name" >
<script type="text/javascript">
var txtId = document.getElementById('name');
txtId.addEventListener('keypress', function(e){
console.log('Pressed!')
})
</script>
</body>
Below code is same as above except that I am using function, inside which I am using same code as above. But in this case, my script tag is above input text tag, and its working. How it's working in this case? Below is the code:
<head>
<script type="text/javascript">
function keyPressListener(){
var txtId = document.getElementById('name');
txtId.addEventListener('keypress', function(e){
console.log('Pressed!')
})
}
</script>
</head>
<body>
<input type="text" id="name" onkeypress="keyPressListener()">
</body>
So, what exactly difference between above 2 codes?
When you are using the onkeypress attribute. It actually works the same way as the addEventListener. You just have to write a simple function and call it in onkeypress
<input type="text" id="name" onkeypress="keyPressed()">
<script>
function keyPressed(){
console.log('Key Pressed');
}
</script>
Why is not working to place above the input
-Because document was not ready .so you need body.onload event .see the body onload=start() it will apply the js function after body loaded
<body onload="start()">
<input type="text" id="name">
<script type="text/javascript">
function start() {
var txtId = document.getElementById('name');
txtId.addEventListener('keypress', function(e) {
console.log('Pressed!')
})
}
</script>
</body>
And the second one -you are using two function in a single event. So use with any one of the event
if use with inline keypress of keyPressListener() else use Dom event of the
keypress (addEventListener)
*Note:
Dont include the addEventListener() inside keyPressListener() .
If you use with addEventListener() remove the onkeypress event inline of the markup.
because both are same action .
<head>
<script type="text/javascript">
function keyPressListener() {
console.log('Pressed!')
}
</script>
</head>
<body>
<input type="text" id="name" onkeypress="keyPressListener()">
</body>
You can use addEventListener.
Or try this as your input:
Add a ; after keyPressListener():
<input type="text" id="name" onkeypress="keyPressListener();">
If that doesn't work try this:
<input type="text" id="name" onkeypress="keyPressListener(); return true;">
HTML5 knows that when you use an onkeypress attribute that it needs to call the JavaScript function when the key is pressed. You can basically put any functional JavaScript in the parameter for the onkeypress="(JavaScript goes here)" attribute.
You can also just grab the element from the DOM and then add the event listener to the element like so:
jQuery: $('#name').onkeypress( function() { //code goes here } );
Regular Js: document.getElementById('name').onkeypress( function() { //code goes here } );
I have an onclick method like this:
onClick: function() {
xx.setValue('i want this to be a button but triggered on keyup');
}
And a keyup method like this:
var that=this;
this.something().on( 'keyup', function() {
xx.setValue('hello'+that.something().getvalue());
} );
this is a preview mode. So i want the text from the onclick button to behave like the text i write with the keyboard
Is this the sort of thing you are wanting to achieve here?
$('#button').click(function() {
$('#output').val('You wanted to type:\n' + $('#textBox').val());
});
$('#textBox').on('keyup', function() {
$('#output').val($('#textBox').val());
});
Check out my fiddle to get a better idea of what I'm suggesting http://jsfiddle.net/ozrevulsion/jssL1xwq/
If this isn't what you wanted then please can you provide your own fiddle of your code failing to do what you want it to do so we can get some more context on what you are asking.
Cheers
Zac
[Edit]
I don't know why I didn't notice you were using native JS for your solution earlier. If you wanted to stick with your native JS and not have to use jQuery here is a solution that does the same as what I did above but in native JS.
function changeTextArea(newValue) {
document.getElementById('output').value = newValue;
}
function printToTextArea() {
changeTextArea('You wanted to type:\n' + document.getElementById('textBox').value);
}
And I guess the HTML is relevant for this native JS solution too so here it is
<input id="textBox" type="text" value="Type Here" onkeyup="changeTextArea(this.value)" />
<br />
<input id="button" type="button" value="Tell me what I typed" onclick="printToTextArea()"/>
<br />
<textArea id="output"></textArea>
And here is the updated fiddle http://jsfiddle.net/ozrevulsion/jssL1xwq/1/
wouldn't this work ?
Html:
<input type=button id=btn value='Submit' onclick=otherFunction(); />
<input type=button id=button value='Submit' onclick=myFunction(); />
<div id="other">
Trigger the handler
</div>
and this:
function myFunction(){
$(#btn).click();
}
function otherFunction(){
alert('this');
}
Note that with jquery you have the keup event :
https://api.jquery.com/keyup/
in this case you could have :
$( "#other" ).click(function() {
$(#btn).click();
});
This question already has answers here:
How to disable all div content
(29 answers)
Closed 9 years ago.
I need to disable a DIV and all it's content using Javascript. I can swear that doing a simple
<div disabled="true">
was working for me before, but for some reason it no longer works. I don't understand why.
In IE10: the text "Click Me" is not greyed out and click handler still works.
I actually need this working for IE10. Below is my code.
<html>
<script>
function disableTest(){
document.getElementById("test").disabled = true;
var nodes = document.getElementById("test").getElementsByTagName('*');
for(var i = 0; i < nodes.length; i++){
nodes[i].disabled = true;
}
}
</script>
<body onload="disableTest();">
<div id="test">
<div onclick="alert('hello');">
Click Me
</div>
</div>
</body>
</html>
The following css statement disables click events
pointer-events:none;
Try this!
$("#test *").attr("disabled", "disabled").off('click');
I don't see you using jquery above, but you have it listed as a tag.
pure javascript no jQuery
function sah() {
$("#div2").attr("disabled", "disabled").off('click');
var x1=$("#div2").hasClass("disabledDiv");
(x1==true)?$("#div2").removeClass("disabledDiv"):$("#div2").addClass("disabledDiv");
sah1(document.getElementById("div1"));
}
function sah1(el) {
try {
el.disabled = el.disabled ? false : true;
} catch (E) {}
if (el.childNodes && el.childNodes.length > 0) {
for (var x = 0; x < el.childNodes.length; x++) {
sah1(el.childNodes[x]);
}
}
}
#div2{
padding:5px 10px;
background-color:#777;
width:150px;
margin-bottom:20px;
}
.disabledDiv {
pointer-events: none;
opacity: 0.4;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="div1">
<div id="div2" onclick="alert('Hello')">Click me</div>
<input type="text" value="SAH Computer" />
<br />
<input type="button" value="SAH Computer" />
<br />
<input type="radio" name="sex" value="Male" />Male
<Br />
<input type="radio" name="sex" value="Female" />Female
<Br />
</div>
<Br />
<Br />
<input type="button" value="Click" onclick="sah()" />
I think inline scripts are hard to stop instead you can try with this:
<div id="test">
<div>Click Me</div>
</div>
and script:
$(function () {
$('#test').children().click(function(){
alert('hello');
});
$('#test').children().off('click');
});
CHEKOUT FIDDLE AND SEE IT HELPS
Read More about .off()
You can't use "disable" to disable a click event. I don't know how or if it worked in IE6-9, but it didn't work on Chrome, and it shouldn't work on IE10 like that.
You can disable the onclick event, too, by attaching an event that cancels:
;(function () {
function cancel () { return false; };
document.getElementById("test").disabled = true;
var nodes = document.getElementById("test").getElementsByTagName('*');
console.log(nodes);
for (var i = 0; i < nodes.length; i++) {
nodes[i].setAttribute('disabled', true);
nodes[i].onclick = cancel;
}
}());
Furthermore, setting "disabled" on a node directly doesn't necessarily add the attribute- using setAttribute does.
http://jsfiddle.net/2fPZu/
i am working on javascript onclick event, when i call function on button click it not gets works on IE browsers (IE-9 & IE-8)
code as following
<input type='image' src="mybutton.jpeg" name="submit" id="button" onclick="return myfunction();" />
i have defined function at top of my page,
<script type="text/javascript">
function myfunction()
{
alert("This is testing");
}
</script>
Working on all other browsers like chrome & firefox but not in IE.
Please help me on this.
Change your onclick from:
onclick="return myfunction();"
to
onsubmit="return myfunction();"
I don't like putting "listener" attributes. This works for me:
HTML:
<input type='image' src="" name="submit" id="button" />
JS:
function myfunction() {
alert("This is testing");
}
document.getElementById('button').addEventListener('click', function() {
return myfunction()
} , false);
I want to extract a value from my hidden inputbox, by using javascript, but sometimes i am getting a "undefined" error and sometimes no output.
when i did
alert(document.getElementById('hhh').value);
from inside a printIt() function i get the output. but i think somehow it is not going in to "var a", and also
var a =22;
works if i remove the
var a =document.getElementById('hhh').value;
in below code.
<script type="text/javascript">
var a =document.getElementById('hhh').value;
function startTime()
{
document.getElementById('txt').innerHTML=a;
a=a-1;
t=setTimeout('startTime()',600);
}
</script>
<body onLoad="startTime()">
<form name="form1" id="form11" method="post" action="">
<input type="hidden" id="hhh" name="time" value="11" />
</form>
<div id="txt"></div>
</body>
Any help would be appreciated.
Thanks.
You call document.getElementById('hhh') before hhh exists. Move it into a function you call onload.
var a =document.getElementById('hhh').value;
This runs before the document is loaded so the underlying element may not exist in the DOM.
You call document.getElementById('hhh') before hhh exists. Move it into a function you call onload.
var a;
function setup() {
a = document.getElementById('hhh').value;
startTime();
}
function startTime() {
document.getElementById('txt').innerHTML = a--;
setInterval(startTime, 600);
}
and run setup(); in your onload.
Leave it as an "type=input" and add the css property: display: none;
<input type="input" id="hhh" name="time" value="11" style="display: none;" />