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 tried following code:
var contentTag = $(this.options.id); //Taking id from user function in plugin function.
var strContent = contentTag.innertHTML.replace('id="paginationTable"','style="display:none";');
Put your dom element in quotes, and as pointed out in comments, inner is spelled wrong and is also not a jquery property, it's a property on the dom element.
You can use the jquery property html() instead to retieve the html property, or if you want to get at the dom element you can use brackets [0] or call jquery method get()
$('#parentID').html().replace('...');
or
$('#parentID').get().innerHTML.replace('...');
If you're looking to get simply show an element, or hide an element you can just use the jquery show() or hide() functions
//show the element
$('#idOfDOMElementToShow').show();
//hide the element
$('#idOfDOMElementToHide').hide();
Also if you're looking to change attributes or classes, take a look at css(), prop() or attr()
I believe you want to hide the paginationTable.
In jQuery that would be
$("#paginationTable").hide();
The String manipulation replace works by replacing a string or regex and returning the changed string
var string = someString.replace("someotherstring","yetanotherstring")
it can use a regex as first expression and a string or a function for the replacement
innerHTML is DOM and not jQuery which uses .html() as mentioned by others
jQUery has a replaceWith which works on jQuery elements
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
I am trying to print 2 strings. What is wrong here?
function alpha(name1, name2){
console.log(name1, name2);
}
<button onclick=alpha("Peter", "Jack")>ok</button>
Others have already told you that the issue is that the value of your onclick needs to be quoted and those quotes should not conflict with the quotes you are already using around your function arguments, but I have a different approach for you....
You really shouldn't be using inline HTML event attributes (i.e. onclick) in the first place. This is a 25+ year old technique that just won't die because it's easy to understand and most new developers just copy someone else's code and convert it to their needs. There are many reasons why this old technique should just fade away and instead, you should use the modern API for event binding, which is .addEventListener().
In your case, it's not obvious why a button would have function arguments hard-coded into it, but if that really is your use case, those should be stored as data-* attributes.
Here's your scenario, reworked into code from this century:
// Get a reference to the DOM element you need to work with
let btn = document.querySelector("button");
// Get the data-* into an array
let people = btn.dataset.people.split(",");
// Do the event binding in JavaScript, not HTML
// We'll set the click event to invoke an anonymous
// function that itself calls the real function and
// passes the proper arguments.
btn.addEventListener("click", function(){
alpha(people[0], people[1]);
});
function alpha(name1, name2){
console.log(name1, name2);
}
<!-- Notice that the data is held in a data-* attribute and
that the code to hook up the event is gone from the HTML. -->
<button data-people="Peter,Jack">ok</button>
You are wrongly defining the handler of onclick.
function alpha(name1, name2){
console.log(name1, name2);
}
<button onclick="alpha('Peter', 'Jack')">ok</button>
You are missing a pair of quotes.
<button onclick="alpha('Peter', 'Jack')">ok</button>
You need quotation marks around the function in HTML
function alpha(name1, name2){
console.log(name1, name2);
}
<button onclick="alpha('Peter', 'Jack')">ok</button>
Using Single quotes '' in the html instead of double will solve the issue. Also put quotes around the function
function alpha(name1, name2){
console.log(name1, name2);
}
<button onclick="alpha('Peter', 'Jack')">ok</button>
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
the following function
<script>
function new_par()
{
var beginning="<input id=";
document.getElementById("debug").innerHTML=beginning;
}
</script>
produces no output, although if I remove the "<" sign, it does. Presumably the javascript avoids an output that would destroy the html page, but would there be anyway to force the output?
You're assigning it to a node's innerHTML property. When you plug the string into the DOM it's trying to parse it as though it were HTML. If you were to simply add it as a text node it would appear.
var beginning="<input id=''";
document.body.textContent = beginning;
https://jsfiddle.net/2patzyo1/
Edit: upon looking again at your question, if you are trying to get the input element to appear on the page, the string you're using isn't proper HTML because you never closed the tag. When the browser runs into it, it tries to parse and render it, but because it isn't valid it gives up. This will work:
var beginning="<input id=''>";
document.body.innerHTML = beginning;
https://jsfiddle.net/2patzyo1/1/
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
i have a JS variable like this:
var elmnts = $('#elm1, elm2, #elm3, #elm4')
how can i add and remove other html elements?
i try this code but there is no result.
elmnts.add('#elm5');
elmnts.remove('#elm1')
$.fn.add returns new collection, it doesn't modify original one. So you should use this syntax.
elmnts = elmnts.add('#elm5');
To remove element from a collection of jQuery objects you can use $.fn.not method:
elmnts = elmnts.not('#elm1');
You should not use remove for this, it's used to delete element from DOM tree.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
i am curious to know, how can i assign multiple html elements to a single variable in jquery...
for an example if i am having...
$('.some').drags();
$('.some1').drags();
at one instance i want variable drgoff
var drgoff = $('.some').offset().top;
at other instance i want variable drgoff
var drgoff = $('.some1').offset().top;
i am using this drgoff in the function, so now my question is how can i get all that html elements in place of .some when that particular html element is called...
var drgoff is not inside function it is a global variable..
thanx for any help...
it can be done using if else also but that will be too lengthy..
Use jQuery's .add(). var drgoff = $('.some').add('.some1');
Live demo here (click).
Well don't know when you are setting the value for drgoff. If you have a function (as indicated in question), then you can pass it the class name for which you want to get the value like this:
function getDragOffValue(cname){
dragoff = $(cname).offset().top;
}
and use it like:
getDragOffValue(".name");
alert(dragoff);//gets value for elements with class .name
getDragOffValue(".name1");
alert(dragoff);//gets value for elements with class .name1
But I don't understand how your code will behave if you have multiple elements with same class name. It will return the offset().top value for first element in collection of elements with given class. In short $(".name").offset().top is as good as $(".name:first").offset().top.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I'm making a jQuery plugin that displays alerts on the page. The plugin itself inserts the alert markup into the DOM. Since the jQuery way is to make everything return this to maintain chaining, I've run into an interesting issue I'd like feedback on. I'm trying to decide between the following two options.
Option One:
$("#content").alert('prepend', {type:'error', message:'This is an error'})
This looks pretty simple. An alert is prepended to the beginning of the #content DOM element. The problem is that it's unclear what is returned. It would make sense to return the alert element that was just created, but that kind of goes against the jQuery way.
Option Two:
$("<div>").alert({type:'error', message:'This is an error'}).prependTo("#content")
This way seems less clear and less intuitive, but it's more inline with the jQuery way of doing things, and it's clear what element is going to be returned.
So which options would you choose? My concern is that most users may not know that you can do $('<div>') to create a new element. On the other hand, I don't know of any well-known projects whose jQuery plugin methods return elements other than the elements they're invoked on, but perhaps there are. Thoughts?
I would just put it in the jQuery namespace (instead of on its prototype):
$.alert({type:'error', message:'This is an error'}).prependTo("#content");
In addition, you might consider asking for a selector/DOM node/jQuery object, instead of having the user prepend it themselves:
$.alert({
parent: '#content', // or $('#content') or document.getElementById('content')
type: 'error',
message: 'This is an error'
});
If your alert system is meant to be a popup-like or modal-like system, the user shouldn't have to specify a container. However, you can allow him to pass a container to insert your alertbox in:
$.alert({
type: 'error',
message: 'This is an error',
container: $(...) // Optional
});
It would return your plugin instance, or the alert container.
No, jQuery does not always return this. Chainability means only that you should return the instance itself if there's no result of your method.
For example, the clone() returns a new jQuery instance too; so there's nothing wrong with it. If you say "it's unclear", just document it, or rename the method to e.g. "$.fn.getAlert".
Yet, you must choose the signature of your method. The first option is like having a mandatory parameter for the container. If you like to make it optional, you might make the alert system a static method: $.createAlert(...) with an optional parameter.