Just wondering if this is poor JS coding practice [closed] - javascript

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 have 2 separate functionalities on one page of my site, both of which call the same Ajax function. The 2 functionalities need to be distinguishable. My solution was to pass a string (called string here) in one of the functions, such as in the following simplified example.
<script type="text/javascript">
function AjaxFunction(string) {
if (string === 'String') {
alert('You have clicked Button2');
} else {
alert('You have clicked Button1');
}
}
</script>
<button type="button" id="Button1" onclick="AjaxFunction()">Click1</button>
<button type="button" id="Button2" onclick="AjaxFunction('String')">Click2</button>
This seems perfectly fine to me. The only issue is that string is null when Button1 is clicked. I imagine there is no problem with this since the if...else takes care of any ambiguity of what to do with string. I have tested with my actual Ajax function and everything works OK, but since I am still somewhat new to coding I always imagine that stupid mistakes I am not aware of will destroy the site. Sorry for the trivial question but am I missing any performance issues, bugs, etc. with this approach? Thank you for any help!

You need to pass an empty string into the first button call. So:
onclick="AjaxFunction('')"

Related

More efficient jquery coding [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
What is more efficient between these two sets, and why. Thanks :)
<button data-target="1" class="target-buttons'>Target</button>
$(document).on('click', '.target-buttons', function() {
alert($(this).data('target'));
});
<button onclick="alertTarget('1')" class="target-buttons">Target</button>
function alertTarget(value) {
alert(value);
}
Thanks very much!
<button onclick="alertTarget('1')" class="target-buttons">Target</button>
function alertTarget(value) {
alert(value);
}
Would be more efficient since it's more re-usable than the former. With this, you don't have to set up a bunch of click events and it's streamlined via html. Technically you do have to set up the click event, but it's more obvious than the former IMO.
Efficiently doesn't particularly matter in this case I don't think.
In general you don't want to mix HTML with JavaScript so the former would be best.

href that only runs javascript [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I have an a tag inside of a form that is used to remove uploaded files. I don't want the a tag to take the user to another section of the page, or try to submit the form or anything like that, I only want it to run a javascript function. How can I accomplish this? I'm not sure what to put in the href?
You can use #:
function doSomething() {
alert('test');
}
Click me
Really, any URL can go there - the return false; short-circuits the default behaviour of the link.
In general, if at all possible, it's best to use a real URL that does the same thing your JS does, for users who have JS disable. This is called "graceful degradation".
You really need to add more code and examples to your questions in the future. Fortunately I know what you're actually asking.
In the function that runs when you click the link, you want to prevent its default behavior.
Here's a very simple example:
<a href="http://google.com" id="myanchor">
Javascript
document.querySelector('#myanchor').addEventListener('click', function (ev) {
ev.preventDefault();
// your code here.
});
<form>
<!-- other inputs-->
<input type='button' onclick='run()' />
</form>
Then for the Javascript:
function run() {
//do something
}

Temporarily comment out <script> tag for debugging [closed]

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
Often while coding and debugging I might want to comment out a <script> tag. An example might be when doing the following:
<script src="lib/jquery.js"></script>
<!--script src="lib/jquery.min.js"></script-->
I tend to add the new line instead of just changing the original to act as a reminder that I want to put that back before going live. I got this syntax from a colleague but I had never seen this it before. Is there a syntactically correct method to comment out <script> tags in HTML?
EDIT: I know there are lots of discussions about commenting out scripts in order to hide them from older browsers but that is not what I am doing. I am wanting to hide the tag completely.
One option would be to dynamically load your scripts in, given a debug flag. For example:
Markup:
<script src="lib/include.js"></script>
include.js
var IS_DEBUG = true;
if(IS_DEBUG) {
loadScript("jquery.js");
loadScript("anotherscript.js");
}
else {
loadScript("jquery.min.js");
loadScript("anotherscript.min.js");
}
function loadScript(name) {
var elem = document.createElement("script");
elem.src = name;
document.getElementsByTagName("head")[0].appendChild(elem);
}
That means you can just toggle the IS_DEBUG flag to load in the required scripts. This is a very rudimentary example, but you get the idea. You might even be able to tie this in with something like require.js

JavaScript global function [closed]

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 have a function in a JavaScript file:
myscripts.js:
function myOn(node,event, selector, data, handler)
{
document.write("This text comes from an external script.");
}
and in the HTML file, I have this:
<body>
<script src="myscripts.js"></script>
...//some text and tags
<script>
myOn(outer, 'click','.deleteButton ', "", deleteDiv);
</script>
<body>
the function "myOn" don't run in the HTML file.
How i make this work?
I have searched the internet, but found some hard example for me to understand.
I need a simple example for beginner like me.
You have a syntax error in the function definition, there shouldn't be another parenthesis inside the parentheses
This line:
function myOn(node,event, selector, data, handler(eventObject))
should be:
function myOn(node,event, selector, data, handler)

Assigning and using jquery with variables [closed]

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 have two peices of code. One produces the desired result the other one doesnt.
Works:
$("#inBox" + mesh.id).html(mesh.text);
Doesn't work:
var inbox = $("#inBox" + mesh.id);
inbox.html(mesh.text);
Could someone please explain to me why one produces the desired result and the other one doesn't do anything?
edit: removed typo quote mark.
edit2: heres the fiddle. http://jsfiddle.net/ntkachov/zXGjb/
edit3: Hmmm.... It works inside the fiddle but not inside my code. Ill take a look at what else might be affecting this.
Looks like you have a typo:
inbox.html(mesh.text");
Should be:
inbox.html(mesh.text);
I created a jsfiddle that shows your example. It works fine for both cases.
You have a trailing " after mesh.text
inbox.html(mesh.text");
This should do it:
inbox.html(mesh.text);
Edit:
Added a fiddle for demonstration: Fiddle

Categories

Resources