webForumDet fria alternativet

Kan man göra en drop down meny som ger tre olika priser beroende på

HTML & CSS

12 svar · 1 386 visningar · startad av rattaratt

Medlem sedan dec. 20127 inlägg
Frågan#1

Hej, har gjort en drop down meny enligt nedan. Problemet är att jag vill ha tre olika priser - på varje val - beroende på personens ålder.

D.v.s. väljer man 267 000 kr ska det kosta 12, 35 resp. 60 kr beroende på ålder o.s.v. Kan man lägga in flera value? Eller finns det en bättre lösning?

Hoppas ni fattar vad jag menar
Tack på förhand!

<html> 
    <body> 
<table border="0">
<tbody>
<tr>
<td>Belopp</td>
<td>Premie/mån </br>t.o.m 35 år</td>
<td>Premie/mån </br> 36-50 år</td>
<td>Premie/mån </br> 51-65 år</td>
</tr>
<tr>
<td>
        <select id="products"> 
            <option value="0">0 kr</option> 
            <option value="12">267 000 kr</option> 
            <option value="20">445 000 kr</option> 
        </select> 
</td>
<td>
        <span id="price">0 kr</span>
        <script type="text/javascript"> 
            function changePrice() 
            { 
                document.getElementById('price').innerHTML = this.value; 
            } 
             
            document.getElementById('products').addEventListener('change', changePrice, false); 
        </script> 
      </body> 
</html>  

  </td>
<td>
-
</td>
<td>
-  
</td>
</tr>
</tbody>
</table>
Medlem sedan dec. 2009872 inlägg
#2

Tror du tänker lite snett.

Alltså...
1. Hur gammal är du? = under 35

2. Välj värde: 267.000 (ger 12 kr/ mån baserat på ålder som valts ovan.)

***
Svårt att beskriva här, men när "värdet ska väljas vet du ju redan åldern på personen i fråga" så att säga!!

Are you with!?

Medlem sedan dec. 20127 inlägg
#3

civilpolisen skrev:

Tror du tänker lite snett.

Alltså...
1. Hur gammal är du? = under 35

2. Välj värde: 267.000 (ger 12 kr/ mån baserat på ålder som valts ovan.)

***
Svårt att beskriva här, men när "värdet ska väljas vet du ju redan åldern på personen i fråga" så att säga!!

Are you with!?

Tjenare, ett alternativ kan ju vara att göra som du säger. Jag tyckte dock att det var enklare och mer informativt att slippa steg 1 - och enbart ha steg 2 där tre priser presenteras beroende på ålder. Dvs

1. Välj värde - ex, 267 000 kr ger tre värden eller
under 35 år - 35-50 år - 51-65 år
12 kr - 25 kr - 45 kr

Ska dock skissa lite på ditt alternativ och se hur det ser ut. Stort tack för din tanke och hjälp, kanske är det både bäst och enklast! :-)

Medlem sedan dec. 20127 inlägg
#4

Civilpolisen, har försökt göra som du säger men får inte ihop det. Är dessvärre inte allt för bra på detta häringa. Har du något exempel på hur du hade tänkt löst det?

Hade varit hur bra som helst i sådana fall!!

Medlem sedan juni 20019 519 inlägg
#5

var kommer alla priser ifrån då? Hur skall det se ut och hur vill du att det fungera?

Medlem sedan dec. 20127 inlägg
#6

Jag vet vad en miljon kronor kostar och detta har jag lagt in för respektive ålder som value. Exempelvis 267 kr för en person som är 18 år. Därefter ska man välja hur stort belopp man vill ha - låt oss säga 2 000 000 kr.

Då ska detta ge ett svar med följande formel.

value * (belopp/1 000 000) = Ditt pris
267 kr * (2 000 000 /1 000 000) = 534

Hoppas att du fattar vad jag är ute efter. Bifogar den kod jag lyckats få ihop.
Tack på förhand!

<html>
<body>
<select id="alder">
<option value="268">18 år</option>
<option value="272">19 år</option>
<option value="277">20 år</option>
</select> </br>
<script type="text/javascript">
function rakna(){
document.getElementById("summa").value = document.getElementById("tal").value;
}
</script>

<input type="Text" id="tal" onkeyup="return rakna();" onkeypress="return rakna();"><br>
<input type="Text" id="summa" value="0">

Medlem sedan juni 20019 519 inlägg
#7

och belopp är vad i din HTML sturktur? Elementet med id tal? och är det alltid 1 000 000 du skall dela med? Läs din första inlägg, förstå inte vad för data du har och vad du vill få in för data för att få något önskat resultat.

om det alltid är 1 000 000 du är intresserad över: http://jsbin.com/exizaq/2/edit

Medlem sedan dec. 20127 inlägg
#8

Jag är stum. Det är nog den mest eleganta lösning jag sett. Hade aldrig lyckats göra det själv. Precis så jag ville ha det - och du lyckades trots mina dåliga anvisningar. Stort tack!

Får jag använda ditt script? Och hur gör jag i sådana fall för att lägga in det i min wordpress sida? Är det bara att göra det rakt av så att säga?

Medlem sedan juni 20019 519 inlägg
#9

det är bara att köra... hur jag har kört med event bindning(onload, onchange osv) hade kunnats göras bättre, men tror det räcker för ditt syfte.

Medlem sedan dec. 20127 inlägg
#10

Helt underbart. Det räcker mer än vä för mitt syfte. Hade som sagt aldrig klarat av att göra detta själv. När jag lägger in koden körs dock inte ditt fina script.

Med risk för att helt idiotförklara mig själv - måste jag lägga in en knapp eller dylikt för att så att säga aktivera scriptet varje gång? Eller har jag missat något annat?

Jag har bara lagt in ditt script rakt av enligt nedan.

<html>
  <head>
    <meta charset=utf-8 />
    <title>JS Bin</title>
  <style id="jsbin-css"></style></head>
  <body>
    <select id="alder">
      <option value="268">18 år</option>
      <option value="272">19 år</option>
      <option value="277">20 år</option>
    </select><br>
    <input type="Text" id="tal"><br>
    <input type="Text" id="summa" value="0">
  <script>
document.body.onload = function() {
  var doc = document;
  var price = doc.getElementById('tal');
  var age = doc.getElementById('alder');
  var sum = doc.getElementById('summa');
  var count = function(){
    var p = parseInt(price.value, 10);
    var a = parseInt(age.value, 10);
    if(typeof p === 'number' && typeof a === 'number') {
      sum.value = a * (p / 1e6);
    }
  };
  price.onkeyup = age.onchange = count;
};
</script>

</body>
</html>
Medlem sedan juni 20019 519 inlägg
#11

nej, så länge du inte ha något bundet på onload eventet på bodyn som skriver över koden så skall det bara vara att köra. kolla javascripts loggarna i din webbläsare för att se vad som händer på din sida. men du få inte ha fler element med samma ID på din sida. Så enklast hade varit om du länkar till din sida så man ser problemet.

Medlem sedan dec. 20127 inlägg
#12

Hej försökte komma tillrätta med problemet på egen hand. Dessvärre utan något egentlige resultat :-)

Här kommer en länk till min sida. Hoppas att du kan hjälpa mig (igen).

vipshopping.se/

Medlem sedan juni 20019 519 inlägg
#13

du kan börja med att skriva rätt tecken, få JS fel direkt:

	
if(typeof p === 'number' &#038;&#038; typeof a === 'number') {

är din JS kod.

Sen få du inte ha fler än en body,html element på din sida.

270 ms totalt · 4 externa anrop · v20260731065814-full.a51de22e
132 ms — deklarationer (db)
0 ms — hämta statistik (cache)
136 ms — hämta tråd, inlägg och bilagor (db)
129 ms — ändringar (db)