Note that there are some explanatory texts on larger screens.

plurals
  1. POCreating a JQueryscript for GM - Trouble by rewriting the JS code
    primarykey
    data
    text
    <p>after trying to solve the problem without and with help I'm still stuck. My aim was writing a GM-script with JS. Someone told me to use jQuery because of its simplicity. Well, I started learning JS last week and my head is full of information. What I need is hint/start/beginning/whatever telling me how to rewrite the script into a fine working jQuery-script. Well, I read some manuals, but somehow I just cannot figure it out. It might be that I misunderstood the syntax of jQuery which can't be hard to unserstand. At least I relived the manuals...</p> <p>This is how the script should work: 1. I created 3 functions. One for checking whether the inputfields contain numbers and only allow digits, commas, points and some controls. A second to replace characters and alert if sth. is badly wrong. The third to sum up four fields and put the result in the fifth. 2.I created two functions for each field. One function hides the text, one function shows the text by clicking 'a'. 3. At least I created a table with all inputfields and text it should contain. 4. By clicking a special button the note appears(I still have to write that...)</p> <p>It's a big deal for me putting all the information together and writing a good and goodlooking(and I know it is not - yet) script.</p> <p>I really hope I you can help me. I just need a beginning...</p> <p>The following is the code I wrote. It won't work in GM because of the used document.write function because of the sandbox, etc. :-(</p> <p>checks whether the inputfields contain numbers, only allows digits, commas, points and some controls</p> <pre><code>function check(event) { var keycode; if (window.event) { keycode = window.event.keycode; } else if (event) { keycode = event.which; } else { return true; } if (47 &lt; keycode) { if (keycode &lt; 58) { return true; } } var keycodeascii = new Array(0,8,44,46); while (keycodeascii.length &gt; 0) { if (keycode == keycodeascii.pop()) { return true; } } return false; } </code></pre> <p>replaces any character by '.',doesn't allow characters at the beginning and end</p> <pre><code>function replace(id) { with(id) { var oldValue = value; var newValue = oldValue.replace(/\W+/g, "."); newValue = newValue.replace(/\W+$/g, ""); newValue = newValue.replace(/^\W/g, ""); value = newValue; //alerts if digits are split by more than character var digits = newValue.split("."); if (digits.length &gt;= 3) { alert("Sie haben " + (digits.length -1) + " Sonderzeichen verwendet. Bitte korrigieren Sie Ihre Eingabe."); field.focus(); } } } </code></pre> <p>sums up field1-field4, result appears in field5</p> <pre><code>function calculate() { var summe = (1*window.document.getElementById('field1').value) + (1*window.document.getElementById('field2').value) + (1*window.document.getElementById('field3').value) + (1*window.document.getElementById('field4').value); window.document.getElementById('field5').value = summe; } </code></pre> <p>function to expand and clap information</p> <pre><code>function show() { document.getElementById("huhu").style.display = "inline"; document.getElementById("field1_show").style.display = "none"; document.getElementById("field1_hide").style.display = "inline"; } function hide() { document.getElementById("huhu").style.display = "none"; document.getElementById("field1_show").style.display = "inline"; document.getElementById("field1_hide").style.display = "none"; } function expandCom() { document.getElementById("huhu1").style.display = "inline"; document.getElementById("field2_show").style.display = "none"; document.getElementById("field2_hide").style.display = "inline"; } function clapCom() { document.getElementById("huhu1").style.display = "none"; document.getElementById("field2_show").style.display = "inline"; document.getElementById("field2_hide").style.display = "none"; } function expandOut() { document.getElementById("field3div").style.display = "inline"; document.getElementById("field3_show").style.display = "none"; document.getElementById("field3_hide").style.display = "inline"; } function clapOut() { document.getElementById("field3div").style.display = "none"; document.getElementById("field3_show").style.display = "inline"; document.getElementById("field3_hide").style.display = "none"; } function expandTest() { document.getElementById("field4div").style.display = "inline"; document.getElementById("field4_show").style.display = "none"; document.getElementById("field4_hide").style.display = "inline"; } function clapTest() { document.getElementById("field4div").style.display = "none"; document.getElementById("field4_show").style.display = "inline"; document.getElementById("field4_hide").style.display = "none"; } function expandEff() { document.getElementById("field5div").style.display = "inline"; document.getElementById("field5_show").style.display = "none"; document.getElementById("field5_hide").style.display = "inline"; } function clapEff() { document.getElementById("field5div").style.display = "none"; document.getElementById("field5_show").style.display = "inline"; document.getElementById("field5_hide").style.display = "none"; } </code></pre> <p>creates a table with all needed and wished structures</p> <pre><code>document.write("&lt;table border='1' cellpadding='10' cellspacing='0'&gt;&lt;tbody&gt;"); document.write("&lt;tr&gt;"); document.write("&lt;td bgColor='#FFFFDD'&gt;"); document.write("&lt;table border='0' cellpadding='0' cellspacing='2'&gt;&lt;tbody&gt;"); document.write("&lt;tr&gt;"); document.write("&lt;td&gt;"); document.write("&lt;input type='text' id='field1' name='field_analysis' size='5' value='' onkeypress='return check(event)' onChange='replace(field1)'&gt;"); document.write("&lt;a onClick='show()' id='field1_show'&gt;Text&lt;/a&gt;&lt;a 'onClick='hide()' id='field1_hide' style='display: none'&gt;Text&lt;/a&gt;&lt;br&gt;&lt;div id='huhu' style='display:none'&gt;HUHU&lt;/div&gt;"); document.write("&lt;/td&gt;"); document.write("&lt;/tr&gt;"); document.write("&lt;tr&gt;"); document.write("&lt;td&gt;"); document.write("&lt;input type='text' id='field2' name='field_communication' size='5' value='' onkeypress='return check(event)' onChange='replace(field2)'&gt;"); document.write("&lt;a onClick='expandCom()' id='field2_show'&gt;Text&lt;/a&gt;&lt;a onClick='clapCom()' id='field2_hide' style='display:none'&gt;Text&lt;/a&gt;&lt;br&gt;&lt;div id='huhu1' style='display:none'&gt;HUHU&lt;/div&gt;"); document.write("&lt;/td&gt;"); document.write("&lt;/tr&gt;"); document.write("&lt;tr&gt;"); document.write("&lt;td&gt;"); document.write("&lt;input type='text' id='field3' name='field_outworking' size='5' value='' onkeypress='return check(event)' onChange='replace(field3)'&gt;"); document.write("&lt;a onClick='expandOut()' id='field3_show'&gt;Text&lt;/a&gt;&lt;a onClick='clapOut()' id='field3_hide' style='display:none'&gt;Text&lt;/a&gt;&lt;br&gt;&lt;div id='field3div' style='display:none'&gt;HUHU&lt;/div&gt;"); document.write("&lt;/td&gt;"); document.write("&lt;/tr&gt;"); document.write("&lt;tr&gt;"); document.write("&lt;td&gt;"); document.write("&lt;input type='text' id='field4' name='field_testing' size='5' value='' onkeypress='return check(event)' onChange='replace(field4)'&gt;"); document.write("&lt;a onClick='expandTest()' id='field4_show'&gt;Text&lt;/a&gt;&lt;a onClick='clapTest()' id='field4_hide' style='display:none'&gt;Text&lt;/a&gt;&lt;br&gt;&lt;div id='field4div' style='display:none'&gt;HUHU&lt;/div&gt;"); document.write("&lt;/td&gt;"); document.write("&lt;/tr&gt;"); document.write("&lt;tr&gt;"); document.write("&lt;td&gt;"); document.write("&lt;hr&gt;"); document.write("&lt;input type='text' id='field5' name='field_effort'size='5' value='' OnFocus='calculate()' onkeypress='return check(event)' onChange='replace(field5)'&gt; "); document.write("&lt;a onClick='expandEff()' id='field5_show'&gt;Text&lt;/a&gt;&lt;a onClick='clapEff()' id='field5_hide' style='display:none'&gt;Text&lt;/a&gt;&lt;br&gt;&lt;div id='field5div' style='display:none'&gt;HUHU&lt;/div&gt;"); document.write("&lt;/td&gt;"); document.write("&lt;/tr&gt;"); document.write("&lt;/tbody&gt;&lt;/table&gt;"); document.write("&lt;/td&gt;"); document.write("&lt;/tr&gt;"); document.write("&lt;/tbody&gt;&lt;/table&gt;"); </code></pre> <p>A big thank you to all helping me find a solution. Faili</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload