Javascript questions which don't deserve their own thread.

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

ronin109: Aug 23, 2002

Since you are creating a GM script (hence, developing this for Firefox only) you can use the DOMSubtreeModified or DOMNodeInserted events to signal the deletion script.

# ¿ Jun 3, 2009 05:07

Adbot: ADBOT LOVES YOU

# ¿ Apr 29, 2024 03:17

ronin109: Aug 23, 2002

By default, a form will be submitted whenever a form field has focus and the user presses the enter key so there is no need to recreate that functionality. The proper way to handle client-side validation is by using the form's onsubmit event. If the form fails validation you simply return false to cancel the form's submission. Returning true (actually, by not explicitly returning false) will cause the form to submit.

The main problem with your current approach of listening for key events on the document is that pressing enter anywhere on the page (outside your form) will cause your form to be validated and submitted.

What you really should do is use a submit button and do your validation (refcodecheck) in the onsubmit.

However, all of this is moot if you actually intend to do (presumably secret) reference code checks since, as Avenging Dentist points out, that should be a server-side only check to avoid putting the "secret" answers in the source code of the page.

# ¿ Jul 8, 2009 05:37

ronin109: Aug 23, 2002

Ether Frenzy posted:

You can't do a satisfactory image replacement of the submit button (or at least not have it work in IE 6, which we stupidly continue to support - would typically be done with CSS v2) with input type="submit", it has to be input type="button" to use an image as the button.

An input with type="image" will allow you to use an image. An input type="image" works exactly like an input type="submit" except you can now give it an image source.

# ¿ Jul 9, 2009 17:25

ronin109: Aug 23, 2002

dimebag dinkman posted:

Not exactly. When you click on an image submit with name "myimagesubmit", it is apparently optional for the browser to submit the myimagesubmit=value key/value pair in the form data, and instead only send the mouse click co-ordinates myimagesubmit.x and myimagesubmit.y. Older versions of IE choose to take the option of not doing so.

What Ether Frenzy needed was a button that could (a) contain an image, and (b) submit it's parent form (without the use of JS).

An input with type="image" does that. Whether the input sends x/y coordinates or a name/value pair is of no significance in this case.

# ¿ Jul 14, 2009 21:22

ronin109: Aug 23, 2002

Save the whales posted:

Doesn't this have the same effect? (except not having the user see "mysubmit.x=20&mysubmit.y=30")
code:
<input type="submit" style="border:none;width:[foo]px;height:[bar]px;background-image: url('[baz]');" value="" />

For some reason, I had it in my head that this wouldn't work in IE6, but, your solution works exactly as expected. This is definitely how it should be done. Your solution has the added benefit of keeping the page-formatting logic in the CSS, where it belongs, unlike type="image" where you are forced to put the image src in a tag attribute.

Just one teeny-tiny addition to your solution would be the inclusion of "background-color: transparent".

# ¿ Jul 15, 2009 18:05

ronin109: Aug 23, 2002

awdio posted:

For some reason, I cannot get a span to display when I'm passing the name of it using selectedIndex. If I simply use onChange="Show_Stuff(this.display4)" it works.
... code snippet ...

The following will display the element matching the selected ID attribute:

code:

<script>
function Show_Stuff(selEl) {
    var id = selEl[selEl.selectedIndex].value;
    var el = document.getElementById(id);
    if (el) {
        el.style.display = "";
    }
}
</script>

<select onchange="Show_Stuff(this)">
    <option value="0" selected>nothing</option>
    <option value="display4">display4</option>
</select>

<ul id="display4" class="aListStyle" style="display: none">
    <li>Sound Mixing</li>
    <li>Audio Editing</li>
    <li>Audio Restoration</li>
    <li>Sound Design</li>
</ul>

# ¿ Dec 5, 2009 06:56

ronin109: Aug 23, 2002

Lumpy posted:

How are people doing localization with external .js files?

Similar to your code snippet, I've done something like this previously:

php:

<?
echo '<script src="js/lang/messages-' + $_SESSION['lang'] + '.js"></script>';
?>

Then, in my "js/lang/" folder, I'd have each language file named like so:

messages-en.js
messages-es.js
etc...

ronin109 fucked around with this message at 06:16 on Mar 11, 2010

# ¿ Mar 10, 2010 20:03

ronin109: Aug 23, 2002

Hanpan posted:

I'm trying to figure out a method of storing a unique reference to each tag on a particular page. I won't have any ability to edit the page content and I'll the generated UID to stay the same on every page refresh.

Since browsers don't generate any kind of UID for elements, I was thinking that the only method to do this would be to execute a script which walks the DOM and creates a UID for each it comes across. I don't know how accurate this will be, especially considering I'll need to ensure it creates the same UID for the tag each time the script crawls the page.

Can anyone think of any other, more accurate ways of mapping a page? I know that crazyegg.com monitor their clicks on an element level, but how they do it is beyond me.

I can't think of any reason why you would need to store a reference to every element on a web page? What is the problem you are trying to solve that requires you to do that?

A click event bubbles up the DOM hierarchy so, clicking within a DIV element on a page will trigger an onclick listener on the DIV, it's parent, its parent's parent, etc... all the way up to the document. So, simply adding a click event listener to the document would allow you to determine what element was clicked on the page. This is likely the basis of how crazyegg.com tracks clicks.

# ¿ Mar 24, 2010 17:19

ronin109: Aug 23, 2002

Hanpan posted:

I am attempting to track clicks on specific page elements in order to collect metric data. The problem with event bubbling is that it will give me the element which triggered the click, but there is no reference I can rely on to obtain the exact same element again at a later date.

Unless I am missing something, the click event won't give me the exact road map to a particular element either, will it?

You're correct, the bubbled event will not provide the exact road map to the target element. I'm still unsure why the full path is needed. I'm guessing it is because you intend to use the HTML structure of the web page as a way to ID specific elements. That approach is flawed as the slightest HTML changes will completely screw up all of the click metrics.

I don't know your specific requirements but, if you need to track clicks on specific elements than is there any reason the following won't work?

1. Add a namespaced attribute id on each HTML element you want to track click events on:

code:

<a href="http://www.google.com" click:id="google-link">Google</a>

2. Add a click listener on the document that checks the event target's "click:id" attribute. If the attribute exists then record the click in your click counter for that specific HTML element.

# ¿ Mar 24, 2010 21:39

ronin109: Aug 23, 2002

OneEightHundred posted:

I'm not even sure what the word is for what I'm looking for so Google is failing me:

Python and Lua both support ways to override how objects interact with other objects when you attempt to operate on them using mathematical operators, and ways to override the attribute get/set operations as well.

i.e. if you do a.b = c, you can hook it so that it calls someHookFunction(a, "b", c)

... what's JavaScript's equivalent of this functionality?

Sounds like you're talking about "setters" and "getters". There is no standard, cross-browser, way to do setters and getters in JavaScript.

# ¿ Jul 30, 2010 16:32

Adbot: ADBOT LOVES YOU

# ¿ Apr 29, 2024 03:17

ronin109: Aug 23, 2002

The braces is simply intended to be a way to denote multiple statements in JS (compound statement) as a single expression.

edit: So, to answer your question, no, it doesn't make sense with the example you provided.

ronin109 fucked around with this message at 21:45 on Aug 9, 2010

# ¿ Aug 9, 2010 21:31

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.