Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 4 years ago.
Improve this question
Trying to do something once HTML is loaded and document get ready. However, code doesn't seems to work.
HTML:
<div class="dataprocess"></div>
JS:
$(document).ready(function(){
if( $('div').hasClass('dataprocess') ) {
console.log('working');
}
});
Not able to get working on console. What am I doing wrong?
In your snippet, you're missing the closing brackets for the $(document).ready() function.
$(document).ready(function(){
if($('div').hasClass('dataprocess')){
console.log('working');
}
});
This is the only visible issue in your code.
Also some other things you may have forgotten:
Include the JavaScript file
Include the jQuery dependency
I think the best option is to use id to call the element:
<div id="data_id" class="dataprocess"></div>
and then JS
$(document).ready(function(){
if($( "#data_id" ).hasClass( "dataprocess" )){
console.log("working");
}
});
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
How do I add an eventListener to whole document with jQuery?
$("document").click(function (){
$("h1").css('color', 'red');
})
I want the h1 to change color if clicked anywhere in the document/webpage. Thanks!
Just remove the double quotations in the $("document") line
$(document).click(function (){
$("h1").css('color', 'red');
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Hello</h1>
just using "body" in quotation marks as following also works.
$("body").click(function (){
$("h1").css('color', 'red');
})
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
I have another question asked, a user answered it perfectly and his code is exactly what I need, tested and working on jsFiddle. But now as soon as I copy past it all outside jsFiddle it just doesnt work. My jQuery is very poor.
jsFiddle: http://jsfiddle.net/C9kF3/
The script is below and also in jsFiddle above:
jQuery("a[data-toggle]").on("click", function (e) {
e.preventDefault(); // prevent navigating
var target = $(this).data('toggle');
$('.people > div').hide();
$('.people ' + target).fadeIn();
});
I copy pasted it exactly as it is in that fiddle, didn't change a thing. No errors showing in console, the script just doesn't work. I linked to latest jquery library: code.jquery.com/jquery.min.js.
Put your code in separate .js file and wrapped in:
$( document ).ready(function() {
//your code here
});
After, link this file inside <head> tag
First, you need to have a document ready wrapper around your jQuery code. Second, that feels like a lot of unnecessary code for what you're trying to accomplish. Try this instead:
http://jsfiddle.net/C9kF3/1/
HTML
<ul id="navigation">
<li id="people">
People
</li>
<li>
Business
</li>
<li>
Highlife
</li>
</ul>
CSS
#people {
display:none;
}
jQuery
$(function() {
$('ul#navigation li a').click(function() {
var self = $(this).closest('li'),
navigation = self.closest('ul#navigation');
$('ul#navigation li').not(self).show();
self.hide();
navigation.hide().fadeIn();
});
});
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
I have seen numerous other posts here at SO and across the web, but those deal with trying to add the event handler before the element is created. My situation is different.
I have an html document that has the following segment:
<nav id="main_menu">
<ul>
<li id="liMapFilter" class="list"><img id="imgFilter" src="images/filter_icon.png">Filter</li>
<li id="liDiagnostics" class="list"><img id="imgTools" src="images/tools_icon.png">Administration</li>
</ul>
</nav>
I set after page is loaded, a number of event handlers by calling:
$(document).ready(function() {
home.init();
});
within the home.init() function I set the following listener:
var elmMapFilter = document.getElementById('liMapFilter"');
cs_core.addEvent(elmMapFilter, 'click', home.showDialogMapFilter, false);
All the other listener handlers wire up just fine, but this particular one always throws a null reference. I cannot understand when this handler works just fine:
var elmDiagnostics = document.getElementById('liDiagnostics');
cs_core.addEvent(elmDiagnostics, 'click', core.showDiagnostics, false);
Please advise.
You've got a typographic error. There's a stray " character in your id.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 9 years ago.
Improve this question
I can't figure out why the jQuery functions will not work with the html here
JS Fiddle: http://jsfiddle.net/JonaTheApprentice/E89rg/
function addItem() {
$('#list').append('<li><input type="checkbox" /> item</li>');
}
function removeItem() {
$('#list').children().filter(function () {
return this.firstChild.checked;
}).remove();
}
I don't see an element with id="list", that's what #list refers to.
I think you mean #items-listed. Changing that, and it works
I would get the value from the input id. I would also assign a click event for cleaner coding. Here is an example of your fiddle adding an item. Removing an item is just the reversal.
DEMO http://jsfiddle.net/E89rg/5/
$('#Enter').click(function(){
var Val = $('#item').val();
$('#items-listed').append('<li><input type="checkbox" />'+Val+'</li>');
});
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 9 years ago.
Improve this question
I have a contenteditable div inside jquery tab and I am trying to get the content using a
button. When I click on button a javaScript function is getting called,
inside the function I am trying to grt the content
HTML code
<div id="tab1" contenteditable="true">
<div>line no one</div>
<div>line no one</div>
</div>
JavaScript function
alert($("tab1").text());
alert($("tab1").html());
error
For text(); I am not getting any thing but for html(); it is showing Undefined
I am not able to guess whats wrong with the code...
Any suggestions...
You need to use ID indication "#"
alert($("#tab1").text());
// ^here
DEMO
See you have missed # notation for id selector and make sure to have it wrapped in $(function(){...}) doc ready handler:
$(function(){
alert($("#tab1").text());
alert($("#tab1").html());
});
jQuery expects a selector, not an id. "tab1" is a type selector, it matches <tab1> elements (which do not exist in HTML).
You can use an ID selector though: $("#tab1").
Are you using jquery?
Does it load proprely?
try this
alert($("#tab1").text());
alert($("#tab1").html());
you have to tell jquery that you are looking for an id with "#"