Why won't my delete button work? [closed] - javascript

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 6 years ago.
Improve this question
I have some background in computer programming, but I am just getting into Javascript and jQuery. I have this code that will delete the element's grandparent but the function isn't running at all ("I am not seeing the "alert".) Can you help me find out what is wrong?
NOTE: There are multiple .trashbuttons and I just want the .trashbutton being clicked's grandparent getting deleted.
$("trashbutton").click(function() {
this.parent().parent().remove();
})
EDIT: The answers I have been given are not working. I should also note that the .trashbutton is a img. If that helps.

You have an error in your selector, you forgot the . to select css classes.
And wrap this to $().
try
$(".trashbutton").click(function() {
$(this).parent().parent().remove();
})

I suggests you to keep reading on jQuery and javascript, especially this documentation about jquery selector. Your script function properly, except that $("trashbutton") refer to a <trashbutton></trashbutton> tag, that doesnt exist in your code ( i guess ). If you wanted to target an element class with that use $(".trashbutton") or $("#trashbutton") to target an element with this ID :)

Use $(this)...this will represent DOM element but you need jQuery wrapped element.
Try this:
$(".trashbutton").click(function() {
$(this).parent().parent().remove();
})
Edit: As suggested in comments, make sure you have $("trashbutton") as valid selector..I assume you are dealing with classes hence it should be $(".trashbutton")

You should use #trashbutton if it is an id or .trashbutton if it is a class. Also wrap this as $(this).
$("#trashbutton").click(function() {
$(this).parent().parent().remove();
})

Related

jQuery to append content to div by id not working [closed]

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 7 years ago.
Improve this question
Im trying to append content from a json-encoded result of an AJAX call as follows:
$.each(results["data"], function(i, result){
$("#resultset").append = result["name"];
console.log(result["name"]);
});
When executing the code, console.log records the names of the data elements, but the div remains empty. Not sure why.
HTML:
<div id="resultset">
</div>
.append() is a function that you call, not a property that you assign a value to, so:
$("#resultset").append(result["name"]) ;
(Depending on what is actually in result["name"] you may also want to append some <br> elements, or wrap each result in a <p> element or something...)
Also you JS is trying to use the id "result_set" but in your html the id is "resultset" without the "_".
You've specified the id to be targeted in your JQuery as result_set, but the id in the html is resultset.
You need to make sure these match up exactly!

On [for="description"]' click not working [closed]

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 7 years ago.
Improve this question
JSFIDDLE
I am trying if a label has attribute for="description" on click should focus an other element.
I have tried following but its not working. Is this possible to get click event on an attribute. Or what other can be possibilities to achieve this? other than adding a class or id.
$('[for="description"]').on('Click', function() {
console.log('test');
alert('test');
});
Firstly, the event name is click - note the lowercase c. Secondly, console is not a property of a jQuery object - it's on the window object. Try this:
$('[for="description"]').on('click', function () {
console.log('test');
alert('test');
});
on click should focus an other element
You get this behaviour for free if you provide an input, textarea or select element with an id attribute which matches the for in the label.
Updated fiddle
You have typo in Click event keyword. It should lowercase. Look this code:
$('[for="description"]').on('click', function () {
alert('test');
});
Otherwise, you have not define an element with class name nicEdit-main.
Demo
You have a typo: is .on("click") no .on("Click"). Also $('.nicEdit-main').console.log('test'); console is not property of jquery object.
You need to prevent default behaviour of label click with for attribute set:
$(document).ready(function () {
$('[for="description"]').on('click', function (e) {
e.preventDefault();
$('.nicEdit-main').focus();
});
});
But then the question is, why in first place are you setting for attribute? Use instead any custom attribute, e.g: data-for

Access $(this) element inside .load() function [closed]

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'm trying to remove loader icon from images after they have been loaded. In order to do that, I need to access $(this) but I cannot access the image element and remove js-image-loading class.
variable html contains dynamic HTML contents fetched via ajax.
$(html).find('img').load(function() {
$(this).removeClass("js-image-loading"); //ok image is done loading, remove icon
});
Is this possible to do?
You forgot to quote to the html selector $(html) should be $('html') but I suggest you to use *:
$('*').find('img').load(function() {
$(this).removeClass("js-image-loading");
});
Or, simply $('img').load()
try
$("html").find('img').load(function () {
$(this).removeClass("js-image-loading"); //ok image is done loading, remove icon
});
OR
$('img').load(function () {
$(this).removeClass("js-image-loading"); //ok image is done loading, remove icon
});
NOTE: html is string not object
DEMO

jQuery add html to original-title? [closed]

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've got a button which looks like this:
<a class="buttonS bDefault tipN" id="customerBasket" original-title="<ul class='shoppingBasket'></ul>" href="#"><span class="icos-cart3"></span></a>
Its a tooltip and I want to append list-items to the class shoppingBasket.
I've tried by doing the following:
$('.shoppingBasket ul').append(<li><span class=\'basketPic\'>Test</span><span class=\'basketName\'>Test123</span></li>);
But I get the error:
SyntaxError: Unexpected token '<'
Any ideas what I'm doing wrong here?
You forgot your quotes:
$('ul.shoppingBasket').append("<li><span class='basketPic'>Test</span><span class='basketName'>Test123</span></li>");
EDIT after getting more info:
You're wanting to update an attribute, which is more complicated than just appending something to a dom element. But, you should be able to do it. Try something like this:
$button_title = $('.buttonS').attr('original-title');
$('body').append('<div id="cart-holder" style="display:none;">' + $button_title + '</div>');
$('#cart-holder ul.shoppingBasket').append('<li><span class=\'basketPic\'>Test</span><span class=\'basketName\'>Test123</span></li>');
$('.buttonS').attr('original-title', $('#cart-holder').html());
$('#cart-holder').remove();
This will add a div to the body with the HTML in original-title, append your HTML to it, set the original-title to it, then remove the element it just made. You'll likely have to tweak it to get the effect you want.
Fiddle
Please note that the append() method accepts a string. And you should always add a string to its parameter. Otherwise it won't work for you and you'll get this error.
append("<li><span class='basketPic'>Test</span><span class='basketName'>Test123</span></li>")
This would do it. Otherwise, it won't work.

Simple Button Click not working [closed]

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
Why is this simple onclick JavaScript function not called in JSFiddle ?
HTML:
<input type="button" value="Check" id="zeCheck" onclick="check();" />
JS:
function check() {
alert('ech');
}
DEMO
It doesn't work because you are defining this function in wrong place...
Put your script function in .js file or at the end of document in
<script></script> tags.
Check this fiddle
Take it out from the onload event and it will work. Put it in the body. (left panel)
onLoad in JS FIDDLE is the same as window.onload=function() in JavaScript .
No wrap - in is the same as
<head><script type="text/javascript"> //your
//code goes here</script</head>
So you just have to change it to NO wrap to body.
The function is being defined inside a load handler and thus is in a different scope. You can fix this by explicitly defining it on the window object. Better, yet, change it to apply the handler to the object unobtrusively: http://jsfiddle.net/pUeue/
$('input[type=button]').click( function() {
alert("test");
});
Note applying the handler this way, instead of inline, keeps your HTML clean. I'm using jQuery, but you could do it with with or without a framework or using a different framework, if you like.

Categories