webForumDet fria alternativet

Skriva ut JS-genererad information

JavaScript

6 svar · 313 visningar · startad av annesophie

annesophies avatarannesophieMedlem sedan juni 20012 236 inlägg
Trådstart#1

Jag har ett formulär som räknar ut vissa datum baserat på ett utgångsdatum som besökaren fyller i själv. OnSubmit så fylls då ett antal INPUTs med uträknade datum.

Tex:
Uträkningen av...

fetalmonth = weeks + 1 + ":e veckan" + " av 40";
pregform.fetalweeks.value = fetalweeks;

Läggs onSubmit i

<input type=text name=fetalweeks value="">

Formuläret funkar bra! :)

Men, jag undrar hur jag kan skriva ut innehållet i ovan kod så att jag kan lägga innehållet i en länk:

Som en response.write i ASP liksom.

Ex: <a href="#.asp?V=fetalweeks">Klicka här för att läsa mer om fetalweeks"></a>

Hoppas att nån JavaScripts guru förstår vad jag menar...

Help!

/A :)

Jesper Ts avatarJesper TMedlem sedan nov. 20017 144 inlägg
#2

Fattar inte riktigt hur du menar men, i body:

<script type="text/javascript">
var fetalweeks=20;
document.write('<a href="#.asp?V='+fetalweeks+'">Klicka här för att läsa mer om fetalweeks</a>');
</script>
annesophies avatarannesophieMedlem sedan juni 20012 236 inlägg
#3

Tack Jesper fast nja, nä....formuläret submittas aldrig och det blir lite fel. :(

Jag bifogar kod med förklaring så kanske du, eller någon annan guru, förstår bättre.
Det är bara att spara koden som html så funkar formuläret (blir lite tydligare).

[1]
<form onSubmit="return pregnancyCalc(this);">

<table border=0 cellspacing="0" cellpadding="0" class="breadjustify">
	<tr>
		<td valign="top" colspan="2">
			************* Testa att skriva in 03/27/2004 i "Sista mens första dag" ***************
		</td>
	</tr>
	<tr>
		<td valign="middle" width="170">Sista mens första dag</td>
		<td valign="top">
			<input type=text name=menstrual value="" class="textfield" size=20 maxlength=10> (MM/DD/ÅÅÅÅ)
		</td>
	</tr>        
	<tr>	
		<td valign="middle">Menscykelns längd</td>
		<td valign="top">
			<input type=text name=cycle value="" class="textfield" size=20 maxlength=3>
		</td>
	</tr>
	<tr>
		<td valign="middle">Tid mellan ägglossning och mens</td>
		<td valign="top">
			<input type=text name=luteal value="" class="textfield" size=20 maxlength=3>
		</td>
	</tr>
	<tr>
		<td valign="top" colspan="2">
			&nbsp;
		</td>
	</tr>
	<tr>
		<td valign="middle">&nbsp;</td>
		<td valign="top">
			<input type=submit value="Beräkna &raquo;"  class="button">
		</td>
	</tr>
</table> 
     <p>                    
<table cellspacing="0" cellpadding="0" border="0" class="breadjustify">    
             

	<tr>
		<td width="174" valign="middle">Befruktning skedde runt</td>
		<td valign="top">
			<input type=text name=conception value="" class="textfield" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Du har gått</td>
		<td valign="top">
			<input type=text name=fetalage value=""  class="textfield" size=40 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle"><font color=red>Men du är i</font></td>
		<td valign="top">
			<input type=text name=fetalweeks value="" class="textfield" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Du är i</td>
		<td valign="top">
			<input type=text name=fetalmonth value="" class="textfield" size=25 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Du är i</td>
		<td valign="top">
			<input type=text name=fetalmonths value="" class="textfield" size=25 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>

	<tr>
		<td valign="middle">Du har gått</td>
		<td valign="top">
			<input type=text name=fetaldays value="" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Och har ca</td>
		<td valign="top">
			<input type=text name=fetalkvar value="" class="textfield" size=40 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Ungefärlig förlossningsdag</td>
		<td valign="top">
			<input type=text name=duedate value="" class="textfield" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;"> +/- 2 veckor
		</td>
	</tr>
	<tr>
		<td valign="middle" colspan="2">
			<br><br>
			<b>Här</b> vill jag skriva ut en länk som innehåller veckan man är i.<br>
			Jag måste alltså på något sätt använda informationen fetalweeks, som tex displayas efter rödmarkerad text, och den ska då skrivas ut här:<p>  
			<'a href="minLänk.asp?vecka=HärKommerVeckonumret">Klicka här för att läsa mer om vecka "HärKommerVeckonumret"<'/a><br>
			Den skulle då se ut som följande, om man utgår från 03/27/2004: <br>
						<a href="minLänk.asp?vecka=10">Klicka här för att läsa mer om vecka 10</a><p>
			Jag vet inte om det är mer tydligt nu... ;) Jag får det iallafall inte att fungera.
		</td>
	</tr>
</table>

</form>

                 
<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
function isValidDate(dateStr) {
// -->

// Checks for the following valid date formats:
// MM/DD/YY   MM/DD/YYYY   MM-DD-YY   MM-DD-YYYY 

var datePat = /^(\d{1,2})(\/|-)(\d{1,2})\2(\d{4})$/; // requires 4 digit year

var matchArray = dateStr.match(datePat); // is the format ok?
if (matchArray == null) {
alert("Datumet är inte i rätt format.")
return false;
}
month = matchArray[1]; // parse date into variables
day = matchArray[3];
year = matchArray[4];
if (month < 1 || month > 12) { // check month range
alert("Månad måste vara mellan 1 och 12.");
return false;
}
if (day < 1 || day > 31) {
alert("Dag måste vara mellan 1 och 31");
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert("Månad "+month+" har inte 31 dagar!")
return false;
}
if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day>29 || (day==29 && !isleap)) {
alert("Februari " + year + " har inte " + day + " dagar!");
return false;
   }
}
return true;
}

function dispDate(dateObj) {
month = dateObj.getMonth()+1;
month = (month < 10) ? "0" + month : month;

day   = dateObj.getDate();
day = (day < 10) ? "0" + day : day;

year  = dateObj.getYear();
if (year < 2000) year += 1900;

return (year + "-" + month + "-" + day);
}

function pregnancyCalc(pregform) {
menstrual = new Date(); // creates new date objects
ovulation = new Date();
duedate = new Date();
today = new Date();
cycle = 0, luteal = 0; // sets variables to invalid state ==> 0

if (isValidDate(pregform.menstrual.value)) { // Validates menstual date
menstrualinput = new Date(pregform.menstrual.value);
menstrual.setTime(menstrualinput.getTime())
}
else return false; // otherwise exits

cycle = (pregform.cycle.value == "" ? 28 : pregform.cycle.value); // defaults to 28
// validates cycle range, from 22 to 45
if (pregform.cycle.value != "" && (pregform.cycle.value < 22 || pregform.cycle.value > 45)) {
alert("Din cykel är antingen för lång eller för kort för att \n"
+ "beräkningen ska vara helt korrekt! Vi kommer ändån att försöka \n"
+ "slutföra beräkningen med de uppgifterna som du angett. ");
}

luteal = (pregform.luteal.value == "" ? 14 : pregform.luteal.value); // defaults to 14
// validates luteal range, from 9 to 16
if (pregform.luteal.value != "" && (pregform.luteal.value < 9 || pregform.luteal.value > 16)) {
alert("Tiden mellan ägglossning och mens är antingen för lång eller för kort för att \n"
+ "beräkningen ska vara helt korrekt! Vi kommer ändån att försöka \n"
+ "slutföra beräkningen med de uppgifterna som du angett. ");
}

// sets ovulation date to menstrual date + cycle days - luteal days
// the '*86400000' is necessary because date objects track time
// in milliseconds;  86400000 milliseconds equals one day
ovulation.setTime(menstrual.getTime() + (cycle*86400000) - (luteal*86400000));
pregform.conception.value = dispDate(ovulation);

// sets due date to ovulation date plus 266 days
duedate.setTime(ovulation.getTime() + 266*86400000);
pregform.duedate.value = dispDate(duedate);

// sets fetal age to 14 + 266 (pregnancy time) - time left
var fetalage = 14 + 266 - ((duedate - today) / 86400000);
weeks = parseInt(fetalage / 7); // sets weeks to whole number of weeks
days = Math.floor(fetalage % 7); // sets days to the whole number remainder

//sets fetal age to 14 + 266 (pregnancy time) - time left
var fetaldays = 14 + 266 - (duedate - today);
weeks = parseInt(fetalage / 7); // sets weeks to whole number of weeks
days = Math.floor(fetalage % 7); // sets days to the whole number remainder

// fetal age message, automatically includes 's' on week and day if necessary
fetalage = weeks + " fullgångna veckor" +" och " + days + " dag(ar)";
pregform.fetalage.value = fetalage;

fetaldays = weeks*7 + days + " dagar" + " av 280";
pregform.fetaldays.value = fetaldays;

fetalweeks = weeks + 1 + ":e veckan" + "";
pregform.fetalweeks.value = fetalweeks;

fetalmonth = weeks + 1 + ":e veckan" + " av 40";
pregform.fetalweeks.value = fetalweeks;

fetalkvar = 280 - (weeks*7) - days + " dagar kvar till förlossningsdagen";
pregform.fetalkvar.value = fetalkvar;

fetalmonth = Math.floor(weeks/4)+1 + ":e lunarmånaden" + " av 10";
pregform.fetalmonth.value = fetalmonth;

fetalmonths = Math.floor((weeks*7 + days)/31.111111) + 1 + ":e graviditetsmånaden" + " av 9";
pregform.fetalmonths.value = fetalmonths;

return false; // form should never submit, returns false
}

//  End -->
</script>
[/1]
Jesper Ts avatarJesper TMedlem sedan nov. 20017 144 inlägg
#4

Slår jag in det där datumet så får jag visserligen -43 och 582 dagar kvar till förlossningsdagen!!! ;)
Men detta är iaf mitt förslag:

<SCRIPT TYPE="text/JavaScript">
<!-- Begin

function isValidDate(dateStr) {
// -->

// Checks for the following valid date formats:
// MM/DD/YY   MM/DD/YYYY   MM-DD-YY   MM-DD-YYYY 

var datePat = /^(\d{1,2})(\/|-)(\d{1,2})\2(\d{4})$/; // requires 4 digit year

var matchArray = dateStr.match(datePat); // is the format ok?
if (matchArray == null) {
alert("Datumet är inte i rätt format.")
return false;
}
month = matchArray[1]; // parse date into variables
day = matchArray[3];
year = matchArray[4];
if (month < 1 || month > 12) { // check month range
alert("Månad måste vara mellan 1 och 12.");
return false;
}
if (day < 1 || day > 31) {
alert("Dag måste vara mellan 1 och 31");
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert("Månad "+month+" har inte 31 dagar!")
return false;
}
if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day>29 || (day==29 && !isleap)) {
alert("Februari " + year + " har inte " + day + " dagar!");
return false;
   }
}
return true;
}

function dispDate(dateObj) {
month = dateObj.getMonth()+1;
month = (month < 10) ? "0" + month : month;

day   = dateObj.getDate();
day = (day < 10) ? "0" + day : day;

year  = dateObj.getYear();
if (year < 2000) year += 1900;

return (year + "-" + month + "-" + day);
}

function pregnancyCalc(pregform) {
menstrual = new Date(); // creates new date objects
ovulation = new Date();
duedate = new Date();
today = new Date();
cycle = 0, luteal = 0; // sets variables to invalid state ==> 0

if (isValidDate(pregform.menstrual.value)) { // Validates menstual date
menstrualinput = new Date(pregform.menstrual.value);
menstrual.setTime(menstrualinput.getTime())
}
else return false; // otherwise exits

cycle = (pregform.cycle.value == "" ? 28 : pregform.cycle.value); // defaults to 28
// validates cycle range, from 22 to 45
if (pregform.cycle.value != "" && (pregform.cycle.value < 22 || pregform.cycle.value > 45)) {
alert("Din cykel är antingen för lång eller för kort för att \n"
+ "beräkningen ska vara helt korrekt! Vi kommer ändån att försöka \n"
+ "slutföra beräkningen med de uppgifterna som du angett. ");
}

luteal = (pregform.luteal.value == "" ? 14 : pregform.luteal.value); // defaults to 14
// validates luteal range, from 9 to 16
if (pregform.luteal.value != "" && (pregform.luteal.value < 9 || pregform.luteal.value > 16)) {
alert("Tiden mellan ägglossning och mens är antingen för lång eller för kort för att \n"
+ "beräkningen ska vara helt korrekt! Vi kommer ändån att försöka \n"
+ "slutföra beräkningen med de uppgifterna som du angett. ");
}

// sets ovulation date to menstrual date + cycle days - luteal days
// the '*86400000' is necessary because date objects track time
// in milliseconds;  86400000 milliseconds equals one day
ovulation.setTime(menstrual.getTime() + (cycle*86400000) - (luteal*86400000));
pregform.conception.value = dispDate(ovulation);

// sets due date to ovulation date plus 266 days
duedate.setTime(ovulation.getTime() + 266*86400000);
pregform.duedate.value = dispDate(duedate);

// sets fetal age to 14 + 266 (pregnancy time) - time left
var fetalage = 14 + 266 - ((duedate - today) / 86400000);
weeks = parseInt(fetalage / 7); // sets weeks to whole number of weeks
days = Math.floor(fetalage % 7); // sets days to the whole number remainder

//sets fetal age to 14 + 266 (pregnancy time) - time left
var fetaldays = 14 + 266 - (duedate - today);
weeks = parseInt(fetalage / 7); // sets weeks to whole number of weeks
days = Math.floor(fetalage % 7); // sets days to the whole number remainder

// fetal age message, automatically includes 's' on week and day if necessary
fetalage = weeks + " fullgångna veckor" +" och " + days + " dag(ar)";
pregform.fetalage.value = fetalage;

fetaldays = weeks*7 + days + " dagar" + " av 280";
pregform.fetaldays.value = fetaldays;

fetalweeks = weeks + 1 + ":e veckan" + "";
pregform.fetalweeks.value = fetalweeks;

fetalmonth = weeks + 1 + ":e veckan" + " av 40";
pregform.fetalweeks.value = fetalweeks;

fetalkvar = 280 - (weeks*7) - days + " dagar kvar till förlossningsdagen";
pregform.fetalkvar.value = fetalkvar;

fetalmonth = Math.floor(weeks/4)+1 + ":e lunarmånaden" + " av 10";
pregform.fetalmonth.value = fetalmonth;

fetalmonths = Math.floor((weeks*7 + days)/31.111111) + 1 + ":e graviditetsmånaden" + " av 9";
pregform.fetalmonths.value = fetalmonths;

[b]document.getElementById("myWeek").innerHTML='<a href="minlänk.asp?vecka='+weeks+'">Klicka här för att läsa mer om vecka '+ weeks +'</a>';[/b]

return false; // form should never submit, returns false
}

//  End -->
</script>
<form onSubmit="return pregnancyCalc(this);">

<table border=0 cellspacing="0" cellpadding="0" class="breadjustify">
	<tr>
		<td valign="top" colspan="2">
			************* Testa att skriva in 03/27/2004 i "Sista mens första dag" ***************
		</td>
	</tr>
	<tr>
		<td valign="middle" width="170">Sista mens första dag</td>
		<td valign="top">
			<input type=text name=menstrual value="" class="textfield" size=20 maxlength=10> (MM/DD/ÅÅÅÅ)
		</td>
	</tr>        
	<tr>	
		<td valign="middle">Menscykelns längd</td>
		<td valign="top">
			<input type=text name=cycle value="" class="textfield" size=20 maxlength=3>
		</td>
	</tr>
	<tr>
		<td valign="middle">Tid mellan ägglossning och mens</td>
		<td valign="top">
			<input type=text name=luteal value="" class="textfield" size=20 maxlength=3>
		</td>
	</tr>
	<tr>
		<td valign="top" colspan="2">
			 
		</td>
	</tr>
	<tr>
		<td valign="middle"> </td>
		<td valign="top">
			<input type=submit value="Beräkna »"  class="button">
		</td>
	</tr>
</table> 
     <p>                    
<table cellspacing="0" cellpadding="0" border="0" class="breadjustify">    
             

	<tr>
		<td width="174" valign="middle">Befruktning skedde runt</td>
		<td valign="top">
			<input type=text name=conception value="" class="textfield" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Du har gått</td>
		<td valign="top">
			<input type=text name=fetalage value=""  class="textfield" size=40 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle"><font color=red>Men du är i</font></td>
		<td valign="top">
			<input type=text name=fetalweeks value="" class="textfield" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Du är i</td>
		<td valign="top">
			<input type=text name=fetalmonth value="" class="textfield" size=25 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Du är i</td>
		<td valign="top">
			<input type=text name=fetalmonths value="" class="textfield" size=25 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>

	<tr>
		<td valign="middle">Du har gått</td>
		<td valign="top">
			<input type=text name=fetaldays value="" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Och har ca</td>
		<td valign="top">
			<input type=text name=fetalkvar value="" class="textfield" size=40 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;">
		</td>
	</tr>
	<tr>
		<td valign="middle">Ungefärlig förlossningsdag</td>
		<td valign="top">
			<input type=text name=duedate value="" class="textfield" size=20 style="border-style:solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-left-color:#FFFFFF;border-bottom-color:#FFFFFF;font:verdana;font-size:9px;color:#73717B;"> +/- 2 veckor
		</td>
	</tr>
	<tr>
		<td valign="middle" colspan="2">
		<br>
		[b]<div id="myWeek"></div>[/b]
		</td>
	</tr>
</table>
</form>
annesophies avatarannesophieMedlem sedan juni 20012 236 inlägg
#5

:f TACK Jesper...oh store guru! Ska försöka studera din lösning och lära mig något också. :)

DOCK...

Om man nu lägger in 03/27/2004 i "Sista mens" så är man ju i vecka 10 (9 fullgågna plus 2 dagar men ändock i vecka 10)...nu får jag fram 9.

I koden står det ju week + 1 på ett antal ställen vilket jag då antar är den bit jag saknar.

Vart lägger jag in + 1 så att jag får vecka 10 i länken istället för vecka 9?

Jesper Ts avatarJesper TMedlem sedan nov. 20017 144 inlägg
#6

Tack för komplimanger... :r
Guru...ja, allt är ju relativt. ;)
Du kan deklarera om variabeln weeks strax innan:

weeks=parseInt(weeks)+1;
document.getElementById("myWeek").innerHTML='<a href="minlänk.asp?vecka='+weeks+'">Klicka här för att läsa mer om vecka '+weeks+'</a>';
annesophies avatarannesophieMedlem sedan juni 20012 236 inlägg
#7

Tack Jesper - det funkar perfekt! :f :) :bire

Klart att du är värd komplimanger. JavaScript är djävulens påfund och alla som begriper det där jittret av kod förtjänar massor, och jag menar massor, av beröm! ;)

TACK!

271 ms totalt · 4 externa anrop · v20260731065814-full.d34c6d5a
123 ms — deklarationer (db)
0 ms — hämta statistik (cache)
145 ms — hämta tråd, inlägg och bilagor (db)
120 ms — ändringar (db)