|
JavaScript - How To Write Bind Manually?
One of the platforms I need to code for is a very (very very) old version of iceweasel (3.5.16). It does not support the "bind" function. So, I (naively) thought that writing a bind function might not be so difficult after all. I tried the following:
Code: 'use strict';
if (typeof Function.prototype.bind === 'undefined') {
Function.prototype.bind = function(newCaller) {
this.caller = newCaller;
}
alert('Bind is now defined.'); //Do this to make sure that the conditional block is being entered.
}
window.onload = function() {
try {
myElement.addEventListener('click', this.doSomething.bind(this), false); //this is line 110 (see error message).
} catch (e) {
alert(e.toString());
}
}
However, this causes the following Error to be thrown: [Exception... "Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: http://*** :: anonymous :: line 110" data: no]. What am I doing wrong? (I'm not sure I even understand the error message!) Similar TutorialsSorry about the very newby question but I know nothing about js... I have a call to javascript on a web page. Within this script is the function function t202Init() within it I have var c1 = t202GetVar('c1'); This currently grabs the "c1" variable from the url and sets it. My problem is I want to set it manually without it being in the url. Is there a way to define this on the web page before the script is called? I can't really mod the js itself as this is a unique case and don't want to break it for other uses. Is there a way to define the t202GetVar('c1') w/o it being in the url? Thanks I have a script that runs a sprite animation on the canvas, adapted from he http://www.kadrmasconcepts.com/blog/...-canvas-style/. After wondering why it wouldn't work on Safari or older versions of Firefox, I saw this: https://developer.mozilla.org/en/Jav.../Function/bind and implemented the suggested shim. However, I'm still getting some errors that I can't explain for the life of me. To make this easy for everyone, I threw it in a jsfiddle: http://jsfiddle.net/zachgold/AL3AQ/. Any help would be appreciated. Thanks! Zach Good day all: I have an editable invoice that I have added a sales tax option with a js function doMath(). Prior to my modification with the sales tax option all worked well. the invoice which code is the following: Code: <textarea id="address" rows="6" cols="38" disabled="true">Website:
Email:
TaxID:
</textarea >
<div id="vehicleid"><label><strong><u>Vehicle Information</u></strong></label><p>Year: <?php echo $edit_caryear?></p><p>Type: <?php echo $dhtmlgoodies_categoryupdate?></p><p>Make: <?php echo $dhtmlgoodies_subcategoryupdate?></p><p>ClientID# <?php echo $edit_clientID?></p><p>Current Mileage <?php echo $edit_mileage?></p></div>
<!--</div>-->
<!--<div id="logo">
<div id="logoctr">
<a href="javascript:;" id="change-logo" title="Change logo">Change Logo</a>
<a href="javascript:;" id="save-logo" title="Save changes">Save</a>
|
<a href="javascript:;" id="delete-logo" title="Delete logo">Delete Logo</a>
<a href="javascript:;" id="cancel-logo" title="Cancel changes">Cancel</a>
</div>
<div id="logohelp">
<input id="imageloc" type="text" size="50" value="" /><br />
(max width: 540px, max height: 100px)
</div>
<img id="image" src="images/logo.png" alt="logo" width="280" height="33" />
</div>-->
</div>
<div style="clear:both"></div>
<br>
<div id="customer">
<?php echo $edit_firstname ?> <?php echo $edit_lastname?><p><?php echo $edit_address?></p><p><?php echo $edit_city?>, <?php echo $edit_state?>, <?php echo $edit_zipcode?></p>
</div>
<div id=invoicehead>
<table id="meta">
<tr>
<td class="meta-head">Invoice #</td>
<td><textarea style="background: transparent;" name="invoicenum" id="invoicenun" disabled="true"><?php
srand(time());
$random = (rand()%1000000);
print("$random");
?></textarea></td>
</tr>
<tr>
<td class="meta-head">Date</td>
<td><textarea name="date" id="date">December 15, 2009</textarea></td>
</tr>
<tr>
<td class="meta-head">Amount Due</td>
<td><div name="due" class="due">$0.00</div></td>
</tr>
</table>
</div>
<table id="items">
<tr>
<th>Item</th>
<th>Description</th>
<th>Unit Cost</th>
<th>Quantity</th>
<th>Price</th>
</tr>
<tr class="item-row">
<td class="item-name"><div class="delete-wpr">
<!--<label for=\"dhtmlgoodies_category\">Make:</label>-->
<?php echo $edit_servicearea?><br>
<!--<SELECT NAME="edit_servicearea">
<OPTION>Select One
<OPTION>Air Intake
<OPTION>Brake
<OPTION>Clutch
<OPTION>Cooling System
<OPTION>Driveshaft & Axle
<OPTION>Engine Mechanical
<OPTION>Exhaust
<OPTION>Steering
<OPTION>Suspension
<OPTION>Transmission
<OPTION>Other
</SELECT>-->
<a class="delete" href="javascript:;" title="Remove row">X</a></div></td>
<td class="description">
<textarea name="servicedesc" cols="255" rows="20"><?php echo str_replace('<br/>', "\n", "$inputbox");?></textarea></td>
<td><textarea name="cost" class="cost">$0.00</textarea></td>
<td><textarea name="qty" class="qty">1</textarea></td>
<td><span name="price" class="price">$0.00</span></td>
</tr>
<tr class="item-row">
<td class="item-name"><div class="delete-wpr">
<textarea name="Labor rate" cols="20" rows="3">Labor</textarea><a class="delete" href="javascript:;" title="Remove row">X</a></div></td>
<td class="description" wrap=virtual><textarea>Labor rate for the performance of work --excluding cost for parts.</textarea></td>
<td><textarea class="cost">$75.00</textarea></td>
<td><textarea class="qty" rows="2" cols="10">0</textarea></td>
<td><span class="price">$0.00</span></td>
</tr>
<tr id="hiderow">
<td colspan="5"><a id="addrow" href="javascript:;" title="Add a row">Add a row</a></td>
</tr>
<tr>
<td colspan="2" class="blank"> </td>
<td colspan="2" class="total-line">Subtotal</td>
<td class="total-value"><div id="subtotal">$0.00</div></td>
</tr>
<tr>
<td colspan="2" class="blank"> </td>
<td colspan="2" class="tax-line" style="text-align: left" valign="top">INCLUDE TAX? <input type = "checkbox" id = "taxbox" onclick = "doMath()"><br>DC
5.576%</td>
<td class="total-value"><textarea class="tax" id="tax" >$0.00</textarea></td> </tr>
<tr>
<td colspan="2" class="blank"> </td>
<td colspan="2" class="total-line">Total</td>
<td class="total-value"><div id="total">$0.00</div></td>
</tr>
<tr>
<td colspan="2" class="blank"> </td>
<td colspan="2" class="total-line">Amount Paid</td>
<td class="total-value"><textarea id="paid">$0.00</textarea></td>
</tr>
<tr>
<td colspan="2" class="blank"> </td>
<td colspan="2" class="total-line balance">Balance Due</td>
<td class="total-value balance"><div class="due">$0.00</div></td>
</tr>
</table>
</div>
<!--<div id="terms">
<h5>Terms</h5>
<textarea>NET 30 Days. Finance Charge of 1.5% will be made on unpaid balances after 30 days.</textarea>
</div>-->
</div>
<div>
<SCRIPT LANGUAGE="JavaScript">
document.write('<form><input type=button value="Refresh" onClick="history.go()"></form>')
</script>
</div><br>
<div id="option">
<input type="button" id="button" value="Return to Main Menu" onclick="window.location='/andy/addentry.php' " />
<input type="hidden" name="servicedesc" value="<?php echo $_POST['servicedesc']; ?>">
<br>
<p>
<! I added this button, so that it returns us to the main Menu.>
<INPUT TYPE="button" onClick="window.print()" value="Print" /><br>
</p>
<p><! The above button Clears all the Field's contents ><input type="submit" name="submit" value="Save Changes">
</div>
</form>
the section of the code higlighted in red is where my problem arises. To achieve the desired results(at least so that I thought), I included the following fuction in my js fuction file which is as follows: Code: function update_total() {
var total = 0;
$('.price').each(function(i){
price = $(this).html().replace("$","");
if (!isNaN(price)) total += Number(price);
});
total =roundNumber(total,2);
$('#subtotal').html("$"+total);
$('#total').html("$"+total);
//$('#tax').html("$"+total);
update_balance();
}
var taxRate = .0575;
function doMath(){
//var subtotal = 0.00;//$('.price').each(function(i);
var subtotal = ('#subtotal');//.html("$"+total);
if (document.getElementById("taxbox").checked) {
tax = subtotal* taxRate; //DC 5.576%
tax = roundNumber(tax,2);//the 2 represent the number of digits to round numbers to after decimal point
//tx = " Incl. 5.576%";
}
document.getElementById("tax").value = "$" +tax;
} function update_balance() {
var due = $("#total").html().replace("$","") - $("#paid").val().replace("$","");
due = roundNumber(due,2);
$('.due').html("$"+due);
}
function update_price() {
var row = $(this).parents('.item-row');
var price = row.find('.cost').val().replace("$","") * row.find('.qty').val();
price = roundNumber(price,2);
isNaN(price) ? row.find('.price').html("N/A") : row.find('.price').html("$"+price);
update_total();
}
function bind() {
$(".cost").blur(update_price);
$(".qty").blur(update_price);
}
$(document).ready(function() {
$('input').click(function(){
$(this).select();
});
$("#paid").blur(update_balance);
$("#addrow").click(function(){
$(".item-row:last").after('<tr class="item-row"><td class="item-name"><div class="delete-wpr"><SELECT NAME="edit_servicearea"><option>Select One<option>Air Intake<option>Brakes<option>Clutch<option>Cooling System<option>Driveshaft & Axle<option>Engine Mechanical<option>Exhaust<option>Steering<option>Suspension<option>Transmission<option>Other</select><a class="delete" href="javascript:;" title="Remove row">X</a></div></td><td class="description"><textarea>Description</textarea></td><td><textarea class="cost">$0</textarea></td><td><textarea class="qty">0</textarea></td><td><span class="price">$0</span></td></tr>');
if ($(".delete").length > 0) $(".delete").show();
bind();
});
$(".tax").blur(update_total);//binding tax
//bind();
bind();
$(".delete").live('click',function(){
$(this).parents('.item-row').remove();
update_total();
if ($(".delete").length < 2) $(".delete").hide();
});
$("#cancel-logo").click(function(){
$("#logo").removeClass('edit');
});
$("#delete-logo").click(function(){
$("#logo").remove();
});
$("#change-logo").click(function(){
$("#logo").addClass('edit');
$("#imageloc").val($("#image").attr('src'));
$("#image").select();
});
$("#save-logo").click(function(){
$("#image").attr('src',$("#imageloc").val());
$("#logo").removeClass('edit');
});
$("#date").val(print_today());
});
Again, here my sales tax is highlighted in red. My problem specifically is that I'm unable to: 1.) get the sales tax rate to calculate based on the value of the subtotal, and 2.) on selection for including taxes, to bind the sale tax amount to the total. I trust someone can provide some guidance! Mossa Greetings, I'm looking to add keycode Accessibility to an html + javascript interaction. It's basically like tic tac toe where a user clicks on a cell (these cells are created by divs) and an 'O' appears in the cell. I'd like to be able to tab through the cell fields and hit the spacebar to put the 'O' in the focused cell. Here's an example of the html divs... [code] <div class="grid"> <div class="row row-1"> <div class="box true"><div class="inner" tabindex="0" id="orange"></div></div> <div class="box true"><div class="inner" tabindex="0" id="orange"></div></div> <div class="box true"><div class="inner" tabindex="0" id="orange"></div></div> <div class="box"><div class="inner" tabindex="0" id="orange"></div></div> <div class="clear"></div> </div> </div> [code] What I'm needing to know is where/what code goes into the .js to set up a keydown event. Here's the .js being used... [code] $(document).ready(function() { // init $('#holder .section:first').addClass('current-slide'); $('#nav .btn:first').addClass('current-slide'); $('#holder .section').addClass('noanswer'); $('#holder .section').delay(300).animate({'top':'0px'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down // end init $('.noanswer .box').hover(function() { if ($(this).hasClass('selected')) { $(this).addClass('box-highlight-hover'); } else { $(this).addClass('box-highlight'); } }, function() { if ($(this).hasClass('selected')) { $(this).removeClass('box-highlight-hover'); } else { $(this).removeClass('box-highlight'); } }); // box functions $('.noanswer .box').live('click',function() { $(this).addClass('selected'); }); $('.noanswer .selected').live('click',function() { $(this).removeClass('selected'); $(this).removeClass('box-highlight-hover'); }); // slide animations $('#nav .mobility-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#mobility').css({'top':'-350px','z-index':'10'}); $('#mobility').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#mobility').addClass('current-slide'); } }); $('#nav .vision-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#vision').css({'top':'-350px','z-index':'10'}); $('#vision').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#vision').addClass('current-slide'); } }); $('#nav .hearing-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#hearing').css({'top':'-350px','z-index':'10'}); $('#hearing').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#hearing').addClass('current-slide'); } }); $('#nav .cognitive-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#cognitive').css({'top':'-350px','z-index':'10'}); $('#cognitive').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#cognitive').addClass('current-slide'); } }); // result $('.answerSubmit').hover(function() { $(this).addClass('answerSubmitHover'); }, function() { $(this).removeClass('answerSubmitHover'); }); $('.answerSubmit').live('click',function() { var parent = $(this).parents('.section'); var scoreParent = $(this).parent('.result'); // Calculate max score var maxScore = parent.find('.box').length; // Calculate actual score var actualScore; var selectednotTrue = 0; var selectedCorrect = 0; var notTrue = 0; actualScore = parent.find('.box').length; selectedCorrect = parent.find('.box.selected.true').length; notTrue = parent.find('.box:not(.true)').length; selectednotTrue = parent.find('.box.selected:not(.true)').length; actualScore = notTrue - selectednotTrue + selectedCorrect; scoreParent.find('.answer').html(actualScore); scoreParent.find('.outOf').html(maxScore); $(this).hide(); parent.find('.score').show(); parent.addClass('answer').removeClass('noanswer'); }); }); [code] Please let me know if I'm unclear or if more code is necessary. Thanks for any help you can give! k Hello, I am working on a project that takes links on a page (Not all, depends on if they are Merchandise links or partner links), and passes some parameters to a tracking js call. The problem is, I don't want to put 'onclicks" on every href as there could be a hundred on a page and many of the links are dynamically generated on the backend. So, I was thinking of creating a function that took in parameters from each of the links that are pressed. But I was told "bind" is a good way to do this, but to be honest - it is very confusing to me. How would I do this? Lets say we have two links (there will be many more, but for an example sake). <a href="somelink.html" id="linka">link a</a> <javascript> var cu = new Linktracker({ dispPrice: 30, dispTitle: 'Manager', dispProduct: 'Red Shoes' }); $('linka').observe('click', cu.updateSomeFunc.bindAsEventListener(cu, 'dispPrice', 'dispTitle', 'dispProduct') ); </script> <a href="somelink.html" id="linkb">link b</a> <javascript> var cu = new Linktracker({ dispPrice: 10, dispTitle: 'casual', dispProduct: 'Blue Shoes' }); $('linkb').observe('click', cu.updateSomeFunc.bindAsEventListener(cu, 'dispPrice', 'dispTitle', 'dispProduct') ); </script> How does any particular click know I am referencing the correct "var cu"? Can something like this be done? <a href="somelink.html" id="linkc">link c</a> <javascript> $('linka').observe('click',( var cu = new Linktracker({ dispPrice: 30, dispTitle: 'Manager', dispProduct: 'Red Shoes' }); ) cu.updateSomeFunc.bindAsEventListener(cu, 'dispPrice', 'dispTitle', 'dispProduct') ); </script> What am I missing here? Should I use just "bind" or "bindAsEventListener"? Since each link on the page is unique and will pass different values, what is the best way to do this without putting "onclicks" on every link? My javascript quits working when I am rendering the html? (It works perfectly fine if the page is opened from http address directly). I did some research and concluded that "JavaScript is executed on page load", so when I render my html, my JavaScript functions are not automatically called. My question is how should I call the javascript functions manually? verify.html: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <Title>form</Title> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <link rel="stylesheet" type="text/css" href="xupload.css"> </HEAD> <BODY> <form id="myform" enctype="multipart/form-data" action="/cgi-bin/upload.cgi" method="post" onSubmit="return StartUpload(this);"> <DIV id="div1"> <b><font id='x_max_files'>?</font> files <font id='x_max_size'>?</font> Mb total maximum</b> <div id="upload_input"><input id="my_file_element" type="file" name="file_1" size=58></div> <div id="files_list"></div> <p align=center><input type="submit" value="Upload Files" class="myForm" id="submit_btn"></p> </DIV> </form> <iframe src="javascript:false;" name="xupload" style="position:absolute;left:-9999px;"></iframe> <script type="text/javascript"> //Specify your form ID var x_form_id = 'myform'; var x_mode = 1; var x_tmpl_name = ''; </script> <script src="xupload.js" type="text/javascript"></script> </BODY> </HTML> config file: Code: htmlverify = "../verify.html" Perl: Code: if(my $verifypage = $g->{CV}{htmlverify}) {
# passing variables
xxxxx
....
# render the page:
send_header();
$p->pf($verifypage);
}
I'm working on a website that will basically embed a widget/frame sent by a handler into a user's current page. The user basically adds a script tag to where they would like the HTML to be. The script tag has their settings and is basically a document.write that calls all the code that we want displayed. So here's my problem. We have a map that we need to add in a specific section, and to get the map we have to call another script tag. So we end up having a script tag (map) embedded in another script tag (the code for the widget/frame) or we end up having to document.write inside a document.write. Now this works just fine and as expected in Firefox, Safari, and Chrome. However, Internet Explorer and Opera wait until the first document.write is completely finished before calling the embedded one. Of course the problem with this, is that it takes the map out of the document's flow and just appends it to the bottom left of the page. Since the rest of the page has already been called, there's no way to move the interior "map" script. Any ideas? Basically just trying to figure out how (if even possible) to render an embedded script tag in Internet Explorer and be able to place it properly. I've tried everything that I can think of, including AJAX and Google's unescape script. Any suggestions, I'd greatly appreciate it. Or even if you've encountered a similar problem, and know that it just isn't possible in IE or Opera, that would be fine too. Thanks in advance! Hi i have a function (i wont write it out coz it is too long!) but after i have done the main calculations within this function i wont to display some of the variables in a table. i have writen: document.write( <table border="1"> <tr><td> Value 1 </td><td> document.write(a); //here * </td></tr> </table> ); were it says "here *" i wont to write within the table variable a (which i have defined properly in the function). However, as i have already written document.write it actually displays the text "document.write(a);" instead of the value for var a. Help asap please as it in for school soon! Thanks in advanced :D Is there anyway in JS to capture the user's IP address and then write it to the variable, ip_addy?
I would like to know what is the difference in writing Javascripts in the head scetion of a HTML page and writing it in the body section. Can I divide the scripts between the two sections ? For example some script in head section and some in the body section. I am writing window.open ('first.htm') in the head section, plus some form validation script. I want this first.htm to be displayed once at startup. But everytime I click the submit button and form validation script gets invoked, this window pops up. How do I avoid this ? mrk98 hey ppl. i am new here. looks like i will do some Js for years i have a div called "farmacias" inside the content div i want to write something in the div but this is not working document.getElementById("farmacias").innerHTML='ola' anyone knows why? Hi, Nothing will display in my textarea after pressing an input number which have to seen on the display. The code is from a simple calculator <form action="#" method="get" onsubmit="return false"> <p> <textarea disabled="disabled"></textarea> </p> <div id="calculatorButtons"> <p> <button onclick="calculatorNumber(1)">1</button> <button onclick="calculatorNumber(2)">2</button> <button onclick="calculatorNumber(3)">3</button> <button onclick="calculatorOp('+')">+</button> </p> <p> <button onclick="calculatorNumber(4)">4</button> <button onclick="calculatorNumber(5)">5</button> <button onclick="calculatorNumber(6)">6</button> <button onclick="calculatorOp('-')">-</button> </p> <p> <button onclick="calculatorNumber(7)">7</button> <button onclick="calculatorNumber(8)">8</button> <button onclick="calculatorNumber(9)">9</button> <button onclick="calculatorOp('*')">*</button> </p> <p> <button onclick="calculatorNumber(0)">0</button> <button onclick="calculatorOp(',')">,</button> <button onclick="calculatorClear()">Clear</button> <button onclick="calculatorCalculate()">Calc</button> </p> </div> </form> function calculatorNumber(i) { document.form.getElementById('textarea').innerHTML = i; } What is the right way to refer to the textarea? Within my Flex application I write stuff to the browser via a javascript document write. Is there a command to send to indicate I want to close that stream? When I send the command the rotating indicator keeps running indicating the browser is still expecting some stuff. If I click the stop button on the browser it stops spinning and the stuff I sent (an xml stream) becomes available. As this is an automated process, there is no person to hit the stop button. Hello, I'm new to Javascript. I know how to make a script that when you click on a button it changes a variable. I also know that with document.write I can express this variable but I do not know how to refresh document.write! For example, if I have a var car =3 and when I click on a button car++ (or increases by 1 so it becomes 4 then 5 and so forth depending how many times you click the button) and I write document.write (car), it only shows the 3 and no matter how many times I click on the button, the 3 doesn't change. How can I get the document.write to show the updated variable? Thanks! So I want to have a button that when I click it will change this variable and that number will change live on the page. this had to do wiht HTML and javascirp thow would you make a function that wirtes somthing in a input box(sorry about messy ness i wasint looking)
how would you make when you press a button it writes somthing in a input box.
hi everybody,i ve given a task to write a java script calculating a root using bisection method,i've tried to write it on my own but i dont have a clue how to do that .i suppose to find the root using this EQUATION x^7-32=0.i would appreciate any help!
What is an alternative to document.write? I know I could use <p> in html </p> I would like to use JS though. I hope you can understand my question. I am 14yo and this is not for homework. I just wanna try and learn JS. I read document.write can cause me problems. But all I ever see is: <script type="text/javascript"> document.write("any words"); </script> what alternate could I use? Hello again, I've continued to study and work on JavaScript. I've had some problems with the document.write() function. When I try to do a math problem, the whole content of the page clears out and only displays the solution. For example: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
function jahava()
{
var h = 1
var r = 4
var t = 5
document.write(h += r += t)
}
</script>
</head>
<body>
<button OnClick="jahava()">Click Me!</button>
</body>
</html>
So If I put other content, like the button I was displaying (which I wanted to stay visible), the function would make them all disappear. I would again appreciate any help towards this matter. Sincerely, Taro B. PS; This is not a calculator related problem, just in-general. |
|||||||