Απορίες για JavaScript

teo · 10 Απριλίου 2008

Αυτό που θέλω τώρα να κάνω είναι το εξείς. Έστω οτι θα πρέπει χρήστης να γράφει το χρώμα
του υποβάθρου της επιλογής του σε ένα text box και να το υποβάλλει πατώντας ένα
κουμπί.

Ο κώδικας που εγω εχω γραψει γι'αυτο το πραγμα ειναι ο εξης:

Code:

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function newcolor(color)
{
alert("You Chose " + color)
document.bgColor=color
}
</SCRIPT>
</HEAD>
<BODY>
<h1>Select a Background Color</h1>
<FORM ACTION="#">
<INPUT TYPE="text" NAME="color">
<INPUT TYPE="button" VALUE="Color"
OnClick="newcolor('color')">
</FORM>
</BODY>
</HTML>

Στο τμημα <BODY>...</BODY> Τι ορισμα πρεπει να βαλω μεσα στην παρενθεση της function με ονομα newcolor ετσι ωστε ο κωδικας να λειτουργει κανονικα ? :confused:

help help

Subject to change · 10-04-08

Έτσι όπως το έχεις κάνει περνάς το color σαν string, δηλαδή αυτό θα σου βγάζει πάντα You chose color.
Υπάρχουν πολλοί τρόποι να γίνει αυτό που θες. Το βασικότερο είναι πως θα αναφερθείς στο input που περιέχει την τιμή.
Ο πιο γρήγορος είναι να δώσεις ένα id στο input element (πχ colorInput) και να αναφερθείς στην τιμή του ως document.getElementById("colorInput").value . Έτσι δεν χρειάζεται κανένα όρισμα στη συνάρτηση. Δηλαδή:

HTML:

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function newcolor(color)
{
alert("You Chose " + document.getElementById("colorInput").value);
document.bgColor=document.getElementById("colorInput").value;
}
</SCRIPT>
</HEAD>
<BODY>
<h1>Select a Background Color</h1>
<FORM ACTION="#">
<INPUT TYPE="text" NAME="color" id="colorInput">
<INPUT TYPE="button" VALUE="Color"
OnClick="newcolor();">
</FORM>
</BODY>
</HTML>

On a side note, παρατηρώ ότι έχεις διάφορες κακές συνήθειες στον τρόπο που γράφεις html, οι οποίες καλό είναι να κοπούν τώρα που είσαι στην αρχή, γιατί όταν παγιωθούν, θα είναι πιο δύσκολο να τις αποβάλλεις και να γράφεις σωστό markup (δηλαδή XHTML).
Διάβασε περισσότερα εδώ: https://www.w3schools.com/xhtml/xhtml_html.asp

teo · 10-04-08

Γενικος το "αντικειμενο.μεθοδος.τιμη" δηλ. η document.getElementById("Input data").value την χρησιμοποιουμε οταν εισαγουμε καποια δεδομενα σε ενα text box και κραταει την τιμη του?

Ευχαριστω για την βοηθεια σου.

Ισως θα σε ξαναχρειαστω συντομα γιατι εχω να κανω και κατι αλλα πραγματακια .

Subject to change · 10-04-08

Όχι. η document.getElementById("exampleid") επιστρέφει μια αναφορά στο στοιχείο με id "exampleid". Οπότε προσθέτοντας σε αυτό το .value μπορείς να πάρεις την τιμή που έχει η html attribute value του. Αν ήθελες κάποια άλλη ιδιότητα του, πχ την name, θα πρόσθετες .name.
Τι κατάλαβες;

teo · 10 Απριλίου 2008

Ok νομιζω οτι τωρα κατι εχω καταλαβει δηλ. μας επιστρεφει τις τιμες των ιδιοτητων του αντικειμενου text box. δηλ. το αντικειμενο text box οπως ολοι ξερουμε εχει την ιδιοτητα color και με την document.getElementById("inputColor") μας επιστρεφει τι τιμη εχει παρει η ιδιοτητα color του αντικειμενου text box. Αμα εχουμε π.χ πλητρολογησει κοκκινο που ειναι και το αγαπημενο μου χρωμα οπως ολοι ξερουμε τοτε η ιδιοτητα color θα εχει την τιμη red αρα η document.getElementById("inputColor")
θα επιστρεψει δηλ. θα εμφανισει στην οθονη οτι εχουμε επιλεξει το χρωμα κοκκινο

οκ?
τα λεω καλα?

Αυτο που ισως δεν πολυ καταλαβα ειναι τι ειναι μια αναφορα! Αυτο ισως με μπερδεψε. :worry:

Προφανως οτι λες αναφορα σε κατι εννoεις τι τιμη εχει παρει μια συγκεκριμενη ιδιοτητα του αντικειμενου textbox?

και κατι αλλο πριν ειπα "αντικειμενο.μεθοδος.τιμη" δηλ. document.getElementById("inputColor") δηλ. αυτο που ειπα τωρα ειναι θεωρητικα σωστο ? :hmm:

Subject to change · 10-04-08

Τα έχεις μπλέξει εντελώς.
Δεν υπάρχει καμία ιδιότητα color στο στοιχείο input.
Η τιμή που πληκτρολογεί ο χρήστης βρίσκεται στην ιδιότητα value.

Θα σου πρότεινα να διαβάσεις μερικά πράγματα για HTML και Javascript γιατί φαίνεται να έχεις αρκετά κενά, τα οποία είναι πολύ δύσκολο ή και αδύνατο να καλυφθούν από ένα forum.

teo · 10 Απριλίου 2008

ok thanks!

θα δω τι θα κανω. :redface:

Παντος αμα κανω στο αρχειο html δεξι κλικ και μετα κανω κλικ στο edit with visual studio και μετα κανω κλικ στο αντικειμενο text box μου δειχνει τις ιδιοτητες του αντικειμενου text box δηλ. μου δειχνει την ιδιοτητα color. :hmm:

Subject to change · 10-04-08

To Visual Studio δεν έχει φτιαχτεί για html σελίδες απ'όσο ξέρω.
Χρησιμοποίησε Dreamweaver.

Τις ιδιότητες του στοιχείου input μπορείς να τις βρείς εδώ: https://www.w3schools.com/tags/tag_input.asp

Όπως βλέπεις, καμία εξ'αυτών δεν είναι η color.

teo · 10 Απριλίου 2008

Αρχική Δημοσίευση από Michelle:
To Visual Studio δεν έχει φτιαχτεί για html σελίδες απ'όσο ξέρω.
Χρησιμοποίησε Dreamweaver.

Τις ιδιότητες του στοιχείου input μπορείς να τις βρείς εδώ: https://www.w3schools.com/tags/tag_input.asp

Όπως βλέπεις, καμία εξ'αυτών δεν είναι η color.

ok

εστω τωρα οτι εχω τεσσερα radio buttons με χρωματα blue,green,black,white. και θελω να επιλεγο ενα απο αυτα τα τεσσερα χρωμματα και οταν κανω κλικ στο κουμπακι buttons να το εφαρμοζει σαν background.

ο κωδικας μου ο οποιος ειναι σιγουρα λαθος ειναι ο εξης:

Code:

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function newcolor()
{
if(document.getElementById("colorInput").value)
{
alert("You Chose " + document.getElementById("colorInput").value);
document.bgColor=document.getElementById("colorInput").value;
}
}
</SCRIPT>
</HEAD>
<BODY>
<h1>Select a Background Color</h1>
<FORM ACTION="#">
<INPUT TYPE="button" VALUE="Color"
OnClick="newcolor();">
<INPUT TYPE="radio" NAME="colorInput"   VALUE="blue"> Blue
<INPUT TYPE="radio" NAME="colorInput"   VALUE="green"> Green 
<INPUT TYPE="radio" NAME="colorInput"   VALUE="black"> Black
<INPUT TYPE="radio" NAME="colorInput"   VALUE="white"> White
</FORM>
</BODY>
</HTML>

Αμα μπορεις ξανα ή καποιος αλλος ας βοηθησει.

Παντος στην εκφωνηση της ασκησης που εχω να κανω λεει να χρησιμοποιησω for και if για να ελενξω το χρωμα που εχω διαλεξει αυτο ομως πως θα το κανω?

συγκεκριμενα λεει :
Αλλάξτε την λύση της άσκησης 1(δηλ. αυτη που εδωσε πριν η michelle) ώστε να χρησιμοποιεί κουμπιού
επιλογής radio. Σημειώνεται ότι θα πρέπει να χρησιμοποιήσετε for--if για να ελέγξετε
πιο κουμπί έχει επιλέξει ο χρήστης.

Και παλι ευχαριστω εκ των προτερων

Subject to change · 10-04-08

Δεν θα σου δώσω έτοιμη λύση, απλά θα σου επισημάνω τα λάθη:

Χρησιμοποιείς document.getElementById(), χωρίς να έχεις ορίσει κάπου το συγκεκριμένο id που βάζεις μέσα. Άλλο id και άλλο name.
Δεν υπάρχει τρόπος να αναφερθείς κατευθείαν στο επιλεγμένο στοιχείο μιας ομάδας radio buttons. Πρέπει να κάνεις loop και να τα περνάς όλα ελέγχοντας την ιδιότητα checked του καθενός (όταν είναι true, βρήκες το επιλεγμένο). Εκεί κολλάει και το for.
Για να αναφερθείς στον πίνακα των radio buttons, μπορείς να δώσεις ένα id στη φόρμα σου (πχ "formid") , και έπειτα να τα προσπελάσεις ως document.getElementById("formid").colorInput. Αυτό θα είναι πίνακας, δλδ το πρώτο είναι document.getElementById("formid").colorInput[0], το δεύτερο document.getElementById("formid").colorInput[1] κοκ

Επαναλαμβάνω πάντως ότι πιστεύω ότι έχεις μεγάλα κενά επί του θέματος, και αν δεν τα καλύψεις, θα συναντάς πρόβλημα σε κάθε άσκηση που σας βάζει.
Και οκ, βαριέσαι να διαβάσεις τόσα πράγματα μαζεμένα, το καταλαβαίνω. Αλλά όταν αντιμετωπίζεις κάποιο πρόβλημα, ή κάτι δεν σου δουλεύει σωστά, ψάχνε το στο web, σχεδόν πάντα το έχουν αντιμετωπίσει κι άλλοι. Έτσι μαθαίνεις προγραμματισμό, από το ψάξιμο που θα κάνεις κάθε φορά που συναντάς πρόβλημα.
Επίσης, ξέρεις πως να κάνεις debug την Javascript?
Αν είσαι σε Firefox, θα πας Tools -> Error console. Εκεί γράφεται κάθε error της Javascript (από όσες σελίδες επισκέπτεσαι, γιαυτό καλύτερα να κάνεις clear πριν δοκιμάσεις, ώστε να μην σου βγάζει και άσχετα errors που δεν τα προκάλέσες εσύ).

teo · 10-04-08

Ευχαριστω για τις συμβουλες σου αν και αυριο πρεπει να παραδωσω την ασκηση αλλα δεν μπειραζει τουλαχιστων αυτα που μου ειπες θα τα παρω υποψην μου και θα τα εφαρμοσω τις επομενες ημερες αμα εχω και τον απαιτουμενο ελευθερω χρονο

Subject to change · 11-04-08

Αρχική Δημοσίευση από teo:
Ευχαριστω για τις συμβουλες σου αν και αυριο πρεπει να παραδωσω την ασκηση αλλα δεν μπειραζει τουλαχιστων αυτα που μου ειπες θα τα παρω υποψην μου και θα τα εφαρμοσω τις επομενες ημερες αμα εχω και τον απαιτουμενο ελευθερω χρονο

Το θέμα δηλαδή είναι να σου δώσω έτοιμη τη λύση, ειδικά από τη στιγμή που βλέπω ότι δεν είναι θέμα περιορισμένου χρόνου το πρόβλημα σου αλλά γνωστικών κενών; Ποιό το νόημα; Να πάρεις καλό βαθμό στην άσκηση; Μα μετά δεν θα έχεις μάθει τίποτα.
Γιατί σπουδάζεις; Για να μάθεις κάτι ή για να πάρεις έναν βαθμό;
Η javascript σε συνδυασμό με την html μπορεί να κάνει υπέροχα πράγματα και είναι πραγματικά κρίμα να το αντιμετωπίζεις σαν "μια ακόμα άσκηση".
Όταν ξαναχρειαστείς βοήθεια, ευχαρίστως να σου την προσφέρω. Αλλά έτοιμες λύσεις, όχι. Στην φάση που είσαι, οι έτοιμες λύσεις απλά θα ενισχύσουν τα κενά που έχεις.

teo · 14-04-08

Thanks να εισαι καλα

wagneriandandy · 29-07-08

Εχω κι εγω ενα προβληματακι με τη javascript... Εφτιαξα ενα δοκιμαστικο κωδικα για κατι αλλο που θελω να κανω αλλα κατι πηγε στραβα...

Code:

<html>
<head>
<script type="text/JavaScript"> 
function emot()
{
var k="abc";
var fin=" ";
 if (k==="abc")
 {
  fin ="https://www.emachineshop.com/images/digit1.gif";
 }
 if (k==="cdf")
 {
  fin="https://www.pad2pad.com/images/digit2.gif";
 }
return fin;
}
</script>
</head>
<body>
<img src="javascript:emot();">
</body>
</html>

Οπως φαινεται απο το κωδικα θελω απλα να κανει ενα ελεγχο ενος δοσμενου αλφαριθμητικου και να δινει τη διευθυνση της αντιστοιχης εικονας. Το προβλημα ειναι οτι αν και η συναρτηση μου λειτουργει μια χαρα, το img src δν την καλει. :/:

Θενξ εκ των προτερων για οποιαδηποτε συμβουλη, μονο μη με ριξετε στα πολυ βαθια γιατι εχω μονο κατι ωρες που τη δουλευω τη javascript

Subject to change · 29-07-08

Δεν νομίζω ότι γίνεται να βάλεις τέτοιο src στο img. Μόνο στην ιδιότητα href των links ξέρω να γίνεται, και δεν είναι σωστή πρακτική ούτε εκεί.
H javascript είναι γεγονοστρεφής γλώσσα, αν γινόταν κάτι τέτοιο, σε τι event θα εκτελείτο (στα links ισοδυναμεί με onclick);

wagneriandandy · 29-07-08

Σ' ευχαριστω πολυ Michelle για την απαντηση σου. Με βοηθησε να συνειδητοποιησω τη γεγονοστρεφη φιλοσοφια της γλωσσας. Ετσι τον αλλαξα λιγο τον κωδικα και μου δουλεψε:

Code:

<html>
<head>
<script type="text/JavaScript">
function emot()
{ 
var k="abc";
var fin=" ";
 if (k==="abc")
 {
  fin ="https://www.emachineshop.com/images/digit1.gif";
 }
 if (k==="cdf")
 {
  fin="https://www.pad2pad.com/images/digit2.gif";
 }
document.write('<img src="'+fin+'">')
}
</script>
</head>
<body onload="emot()">
</body>
</html>

Χιλια θενξ! :clapup:

Subject to change · 29-07-08

Μπορεί να δουλεύει τώρα, αλλά είναι πολύ λάθος τρόπος.
Ουσιαστικά χρησιμοποιείς μια μέθοδο που δεν ενδείκνυεται για κάτι τέτοιο: η document.write θεωρείται απαρχαιωμένη και πρέπει να χρησιμοποείται μόνο όταν δεν υπάρχει άλλος τρόπος. Αν καλέσεις document.write αφ'ότου έχει φορτώσει η σελίδα, θα την "διαγράψει" (όχι το αρχείο, απλά δεν θα τη βλέπει πλέον ο χρήστης) και θα προσπαθήσει να δημιουργήσει νέα με αυτό που πέρασες ως όρισμα στην write(). Ο λόγος που δεν το βλέπεις αυτό το πρόβλημα τώρα, είναι ότι ούτως ή άλλως δεν έχεις κάτι άλλο στο <body>. Αν του προσθέσεις υπάρχον περιεχόμενο, θα δεις ότι αυτό αφότου φορτώσει (μιας και καλείς τη συνάρτηση σου στο onload) θα "σβηστεί" και θα εμφανιστεί μόνο η εικόνα.

Υπάρχουν 2 τρόποι να κάνεις αυτό που θες: Να εισάγεις δυναμικά το img tag, μέσω DOM Manipulation, είτε να υπάρχει ήδη το img tag και να του αλλάζεις την ιδιότητα src αφότου αναφερθείς σε αυτό (ο συνηθέστερος: δίνοντας του κάποιο ID, με τη μέθοδο document.getElementById).

Διαβάζεις κάποιο βιβλίο για να μάθεις JavaScript ή προσπαθείς με άλλο τρόπο;

wagneriandandy · 29-07-08

Απο το ιντερνετ διαβασα μερικα πραγματα για τη javascript. Θα ενδιαφερομουν ομως για καποιο βιβλιο. Μπορεις να μου προτεινεις?

Subject to change · 29-07-08

Αν έπρεπε να σου προτείνω μόνο ένα, θα ήταν το ppk on Javascript (εκδόσεις New Riders, συγγραφέας Peter-Paul Koch)
Ωστόσο θα πρότεινα να διαβάσεις και κάποιο πιο εισαγωγικό αρχικά, όπως το Javascript Phrasebook (εκδόσεις O'Reilly).

wagneriandandy · 29-07-08

Θα τα τσεκαρω και τα δυο.Σ ευχαριστω πολυ!

Απορίες για JavaScript

Πολύ δραστήριο μέλος

e-steki.gr Founder

Πολύ δραστήριο μέλος

e-steki.gr Founder

Πολύ δραστήριο μέλος

e-steki.gr Founder

Πολύ δραστήριο μέλος

e-steki.gr Founder

Πολύ δραστήριο μέλος

e-steki.gr Founder

Πολύ δραστήριο μέλος

e-steki.gr Founder

Πολύ δραστήριο μέλος

Εκκολαπτόμενο μέλος

e-steki.gr Founder

Εκκολαπτόμενο μέλος

e-steki.gr Founder

Εκκολαπτόμενο μέλος

e-steki.gr Founder

Εκκολαπτόμενο μέλος