jquery .html not working in firefox

Question

So i have a page where i have a quote request form for a client.

the doc type is

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">

What i am doing is, generating the forms submit button via jquery, so if the client browser has js disabled, the submit button does not appear.

the HTML is as follows.

    <div id="buttonscript">


    </div>

Jquery

<script type="text/javascript" >
   $(document).ready(function(){
   $("#buttonscript").html('<input type=\"image\" name=\"Submit\" src=\"<?=$img_dir?>/button-submit_off.png\" alt=\"Submit\" class=\"nostyle\" style=\"margin-left:-4px;\" />');
});
</script>

It works fine in all browsers but FF it seems.

I have another $(document).ready(function() { on the page would this cause conflicts?

the second one is to invoke jquery.validate plugin on the form.

UPDATE

tried removing all escapes before ". didnt work. No errors in console as far as i can tell. works fine EVERYWHERE but FF.

UPDATE *I AM A NOOB*

Lol anyways, i realized there had to be something funky going on , considering i know that the errors coming up were stating that jquery was undefined....then i remembered an .htaccess directive allowing scripts to only run from same domain, and i had previously been hosting my jquery library, but decided to let google do that for me.... in other words, there wasnt crap wrong with any of my code...it was server configuration.. FINALLY figured it out!

Does the validate need to be in its own `$(document).ready()`? That could be the problem... Also, do you need to escape your double quotes since you start `.html()` with a single quote? — ayyp, Jun 05 '12 at 19:00
I would suggest taking out the `$(document).ready()` for the validate and test whether it works or not then. — ayyp, Jun 05 '12 at 19:02
ive always escaped double quotes...but i can try that. and if the split `$(document).ready()` was the problem youd htink it would conflict in all other browsers as well — RezenX, Jun 05 '12 at 19:02
This might help you : http://stackoverflow.com/questions/2319235/jquery-form-submitting-in-firefox — Ben Lefebvre, Jun 05 '12 at 19:05
think it could have something to do with the php tag in the html? — RezenX, Jun 05 '12 at 19:10
strange that jsfiddle does work and mine doesnt. i also tried removing the php dir reference and still nothing — RezenX, Jun 05 '12 at 19:13
try: `$('#buttonscript').html('yo!')` can you insert anything in ff at all? — raddrick, Jun 05 '12 at 19:48
Are you sure that your code doesn't work? I'm running this on jsfiddle and it's working correctly: http://jsfiddle.net/FireDragonDoL/xrUym/ — Francesco Belladonna, Jun 05 '12 at 19:48

score 0 · Answer 1 · answered Jun 05 '12 at 19:03

0

Wondering why you adding slashes to the double quotas while you started with single ones

'<input type=\"

try to remove the slashes

answered Jun 05 '12 at 19:03

Omiga

572
3
11

ryanve · Answer 2 · 2012-06-05T19:51:43.543

Does it work if you change the doctype to <!DOCTYPE html> ?

Try wrapping your code like this in case there is a conflict:

(function($){
    // safely use $ as an alias for jQuery in here
}(jQuery));

If you look at the DOM in the console, is anything being inserted? In other words, is the problem that nothing is inserted or is it that what's being inserted in incorrect?

In any case, I think there is a better solution for what you're trying to do: On your html tag add a no-js class:

<html class="no-js">

and then remove the class via jQuery:

jQuery(function($){
    $('html').removeClass('no-js').addClass('js');
});

Then you can hardcode the input but have it be hidden when there is not JavaScript. In CSS , you could put something like:

.no-js #buttonscript{ display:none; }

Then you don't have to worry about inserting it at all.

score 0 · Answer 3 · answered Jun 05 '12 at 22:27

0

it all came down to server configuration. realized that jquery library was now being hosted externally. and i had an .htaccess directive blocking external scripts. silly me, i forgot i had done that ages ago!

answered Jun 05 '12 at 22:27

RezenX

45
9

yeah what throws me off though...is why was chrome and IE still displaying everything just fine haha. who knows! – RezenX Jun 06 '12 at 19:43

jquery .html not working in firefox

3 Answers3