javascript - Error with Changing Variable Value with if Statement -


i have radio buttons in accordion, , depending on radio buttons selected, alert different output. (there's ton of css)

var acc = document.getelementsbyclassname("accordion");  var i;    (i = 0; < acc.length; i++) {      acc[i].onclick = function(){          if(!this.classlist.contains("active")) {              closeaccordions();          }          this.classlist.toggle("active");          this.nextelementsibling.classlist.toggle("show");    }  }    function closeaccordions() {      (i = 0; < acc.length; i++) {          acc[i].classlist.remove("active");          acc[i].nextelementsibling.classlist.remove("show");        }  }    var chanceoflive5 = 1;  var user;  function choose(choice){      user = choice;  }    function changechanceoflive2(){      if (user == 'bolts') {          chanceoflive5 = 1;      }      else if (user == 'plates') {          chanceoflive5 = 2;      }    }    var chanceoflive6 = 1;  var user2;  function choose2(choice2){      user = choice2;  }    function changechanceoflive3(){      if (user2 == 'tie') {          chanceoflive6 = 1;      }      else if (user2 == 'struts') {          chanceoflive6 = 2;      }    }    function nextpage(){    var chanceoflive7 = chanceoflive5 + chanceoflive6;    alert(chanceoflive7);  }
button.accordion {      background-color: #eee;      color: #444;      cursor: pointer;      padding: 18px;      width: 100%;      border: none;      text-align: left;      outline: none;      font-size: 15px;      transition: 0.4s;  }    button.accordion.active, button.accordion:hover {      background-color: #ddd;  }    button.accordion:after {      content: '\002b';      color: #777;      font-weight: bold;      float: right;      margin-left: 5px;  }    button.accordion.active:after {      content: "\2212";  }    div.panel {      padding: 0 18px;      background-color: white;      max-height: 0;      overflow: hidden;      transition: 0.6s ease-in-out;      opacity: 0;  }    div.panel.show {      opacity: 1;      max-height: 500px;  }    body {  	font-family: sans-serif;  	font-weight: normal;  	margin: 10px;  	color: #999;  }    form {  	margin: 40px 0;  }    div {  	clear: both;  	margin: 0 50px;  }    label {    border-radius: 3px;    border: 1px solid #d1d3d4  }    /* hide input */  input.radio:empty {  	margin-left: -999px;  }    /* style label */  input.radio:empty ~ label {  	position: relative;  	float: left;  	line-height: 2.5em;  	text-indent: 3.25em;  	margin-top: 2em;  	cursor: pointer;  	-webkit-user-select: none;  	-moz-user-select: none;  	-ms-user-select: none;  	user-select: none;  }    input.radio:empty ~ label:before {  	position: absolute;  	display: block;  	top: 0;  	bottom: 0;  	left: 0;  	content: '';  	width: 2.5em;  	background: #d1d3d4;  	border-radius: 3px 0 0 3px;  }    /* toggle hover */  input.radio:hover:not(:checked) ~ label:before {  	content:'\2714';  	text-indent: .9em;  	color: #c2c2c2;  }    input.radio:hover:not(:checked) ~ label {  	color: #888;  }    /* toggle on */  input.radio:checked ~ label:before {  	content:'\2714';  	text-indent: .9em;  	color: #9ce2ae;  	background-color: #4dcb6d;  }    input.radio:checked ~ label {  	color: #777;  }  button.accordion {      background-color: #eee;      color: #444;      cursor: pointer;      padding: 18px;      width: 100%;      border: none;      text-align: left;      outline: none;      font-size: 15px;      transition: 0.4s;  }    button.accordion.active, button.accordion:hover {      background-color: #ddd;  }    button.accordion:after {      content: '\002b';      color: #777;      font-weight: bold;      float: right;      margin-left: 5px;  }    button.accordion.active:after {      content: "\2212";  }    div.panel {      padding: 0 18px;      background-color: white;      max-height: 0;      overflow: hidden;      transition: 0.6s ease-in-out;      opacity: 0;  }    div.panel.show {      opacity: 1;      max-height: 500px;  }    body {  	font-family: sans-serif;  	font-weight: normal;  	margin: 10px;  	color: #999;  }    form {  	margin: 40px 0;  }    div {  	clear: both;  	margin: 0 50px;  }    label {    border-radius: 3px;    border: 1px solid #d1d3d4  }    /* hide input */  input.radio:empty {  	margin-left: -999px;  }    /* style label */  input.radio:empty ~ label {  	position: relative;  	float: left;  	line-height: 2.5em;  	text-indent: 3.25em;  	margin-top: 2em;  	cursor: pointer;  	-webkit-user-select: none;  	-moz-user-select: none;  	-ms-user-select: none;  	user-select: none;  }    input.radio:empty ~ label:before {  	position: absolute;  	display: block;  	top: 0;  	bottom: 0;  	left: 0;  	content: '';  	width: 2.5em;  	background: #d1d3d4;  	border-radius: 3px 0 0 3px;  }    /* toggle hover */  input.radio:hover:not(:checked) ~ label:before {  	content:'\2714';  	text-indent: .9em;  	color: #c2c2c2;  }    input.radio:hover:not(:checked) ~ label {  	color: #888;  }    /* toggle on */  input.radio:checked ~ label:before {  	content:'\2714';  	text-indent: .9em;  	color: #9ce2ae;  	background-color: #4dcb6d;  }    input.radio:checked ~ label {  	color: #777;  }
<hr>    <button class="accordion">foundation bolting</button>  <div class="panel">        <div>        <input type="radio" name="radio" id="radio1-1" class="radio" onclick="choose('bolts')" checked/>        <label for="radio1-1">foundation bolts</label>      </div>         <div>        <input type="radio" name="radio" id="radio1-2" class="radio" onclick="choose('plates')">        <label for="radio1-2">foundation plates</label>      </div>      </div>    <hr>    <button class="accordion">wall bracing</button>  <div class="panel">    	 <div>        <input type="radio" name="radio2" id="radio2-1" class="radio" onclick="choose2('tie')" checked/>        <label for="radio2-1">strong tie retrofit connectors</label>      </div>         <div>        <input type="radio" name="radio2" id="radio2-2" class="radio" onclick="choose2('struts')">        <label for="radio2-2">angled iron struts</label>      </div>    </div>    <hr>    <form action="">    <div class="wrapper">      <button class="button" onclick="changechanceoflive2(); changechanceoflive3(); nextpage()" align=center>submit</button>    </div>  </form>

when click bottom option each list, should alert 4, instead, alerts 3. why?


-

Comments

Post a Comment

Popular posts from this blog

python - How to insert QWidgets in the middle of a Layout? -

Image
i'm using qt framework build graphical user interface. use qgridlayout position qwidgets neatly. gui looks this: my application regularly adds new widgets gui @ runtime. these new widgets not added @ end of qlayout, somewhere in middle. the procedure bit cumbersome. applied on figure above, need take out widg_c , widg_d , ... qgridlayout. next, add widg_x and widg_y , , put other widgets again. how remove widgets qgridlayout: for in reversed(range(mygridlayout.count())): self.itemat(i).widget().setparent(none) ### as long you're dealing small amount of widgets, procedure not disaster. in application display lot of small widgets - perhaps 50 or more! application freezes second while procedure ongoing, annoying user. there way insert widgets somewhere in qlayout, without need take out other widgets? edit: apparently solution qvboxlayout simple. use function insertwidget(..) instead of addwidget(..) . docs can found link: http://doc.qt.io/qt-5/qboxlayou
Read more

python - serve multiple gunicorn django instances under nginx ubuntu -

i need serve 2 webs apps (django) on gunicorn under different domain names using nginx on ubuntu. started using tutorial: https://www.digitalocean.com/community/tutorials/how-to-set-up-django-with-postgres-nginx-and-gunicorn-on-ubuntu-16-04 it worked fine 1 using that. tried same thing second gives me 502 gateway second domain. tried following tutorial: http://michal.karzynski.pl/blog/2013/10/29/serving-multiple-django-applications-with-nginx-gunicorn-supervisor/ i'm @ part run gunicorn start script: sudo bin/gunicorn_start i response: starting webuildblack root traceback (most recent call last): file "/home/devin/webuildblack/bin/gunicorn", line 7, in <module> gunicorn.app.wsgiapp import run importerror: no module named 'gunicorn.app'; 'gunicorn' not package you have named program gunicorn.py gunicorn -package. rename file , remove gunicorn.pyc file.
Read more

module - Prestashop displayPaymentReturn hook url -

i new prestashop developer , trying create paymentmodule. have got show payment method can not proceed purchase because not know hot works. does know should redirect run hooddisplaypaymentreturn method? i happy if explain me complete navigation map make purchase. anyway, can find relation between hooks , pages? when have new module payment rely on simplest provided prestashop: bankwire. inside can find 3 hooks. hookpayment: public function hookpayment($params) { if (!$this->active) return; if (!$this->checkcurrency($params['cart'])) return; $this->smarty->assign(array( 'this_path' => $this->_path, 'this_path_bw' => $this->_path, 'this_path_ssl' => tools::getshopdomainssl(true, true).__ps_base_uri__.'modules/'.$this->name.'/' )); return $this->display(__file__, 'payment.tpl'); } hookdisplaypaymenteu: public fun
Read more