Javascript 为什么在某些情况下,选定的熨斗页面不';不行?
我创建了一个函数来更改iron-page中的“selected”属性并运行,但在某些情况下,“selected”属性返回最后一个值,给人一种不更改的感觉 元素Javascript 为什么在某些情况下,选定的熨斗页面不';不行?,javascript,navigation,polymer-1.0,Javascript,Navigation,Polymer 1.0,我创建了一个函数来更改iron-page中的“selected”属性并运行,但在某些情况下,“selected”属性返回最后一个值,给人一种不更改的感觉 元素 <template is="dom-bind" id="fulltemplate"> <div id="fullContainer" class="vertical layout flex" hidden> <iron-pages id="pages" class="fancy flex ce
<template is="dom-bind" id="fulltemplate">
<div id="fullContainer" class="vertical layout flex" hidden>
<iron-pages id="pages" class="fancy flex center center-justified" selected="{{pageSelected}}" unresolve>
<div id="logincontainer" class="flex horizontal layout center center-justified">
<paper-material class="shadowbox vertical layout" elevation="3">
<div class="hiddenof">
<h4 id="loginTitle"><iron-icon class="icnadviser" icon="iconnadviser"></iron-icon><span>{{loginTitle}}</span></h4>
<h5 id="changePassword" hidden class="red">{{changePassword}}</h5>
<section>
<paper-input-container id="usernamedecorator">
<label>{{labuser}}</label>
<input id="usernameinput" pattern="[0-9]*" bind-value="{{valUsername}}" is="iron-input" onkeypress="keyPressLogin(event)" required>
<paper-input-error>{{errorInputUser}}</paper-input-error>
</paper-input-container>
<paper-input-container id="passworddecorator">
<label>{{labpass}}</label>
<input id="passwordinput" bind-value="{{valPassword}}" is="iron-input" maxlength='15' onkeypress="keyPressLogin(event)">
<paper-input-error>{{errorInputPass}}</paper-input-error>
</paper-input-container>
<paper-input-container id="confirmpassdecorator" hidden="true">
<label>{{labpass}}</label>
<input id="Text1" bind-value="{{valCPassword}}" is="iron-input" maxlength='15' onkeypress="keyPressLogin(event)">
<paper-input-error>{{errorInputPass}}</paper-input-error>
</paper-input-container>
</section>
<div id="bottomline" class="horizontal layout center">
<div class="clickable red medium flex" id="forgpassText" onclick="goto(1)">{{forgpassText}}</div>
<%--<paper-item class="clickable red medium flex" id="forgpassText" onclick="goto(1)">{{forgpassText}}</paper-item>--%>
<paper-spinner id="spinner" hidden></paper-spinner>
<paper-button id="loginButton" raised class="buttonNeutral" onclick="clickLogin(event);">{{btentrar}}</paper-button>
</div>
<paper-toast
id="errorToast"
duration="4000">
</paper-toast>
</div>
</paper-material>
</div>
<div id="passremcontainer" class="flex horizontal layout center center-justified">
<paper-material class="shadowbox vertical layout" elevation="3">
<div class="hiddenof">
<div class="titbox justify">
<p id="rempassTit" class="big bold center">
<iron-icon class="icnadviser" icon="iconnadviser"></iron-icon><span>{{rempassTit}}</span>
</p>
<p id="rempassSub" class="medium">{{rempassSub}}</p>
</div>
<div class="horizontal layout center-justified">
<section class="notoppadding">
<paper-input-container id="passreqdecorator">
<label>{{labemail}}</label>
<input id="passreqinput" bind-value="{{valmailpass}}" is="iron-input" onkeypress="keyPressLogin(event)">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
</section>
</div>
<div class="horizontal layout">
<div class="flex"></div>
<paper-button id="cancelPassB" raised class="buttonCancel" onclick="goto(0)">{{btcancelar}}</paper-button>
<paper-button id="acceptPassB" raised class="buttonNeutral" onclick="sendpassreq()">{{btenviar}}</paper-button>
<paper-spinner id="passspinner" hidden></paper-spinner>
</div>
<paper-toast
id="remToast"
duration="2000">
</paper-toast>
</div>
</paper-material>
</div>
<div id="masinfoDiv" class="flex horizontal layout center center-justified">
<paper-material class="shadowbox bigboxshadow layout vertical" id="infoshadow" elevation="3">
<div id="infoDivScroll" class="hiddenof flex vertical layout">
<div class="titbox justify" class="bigboxshadow">
<p id="moreinfoTit" class="big bold center-text"><iron-icon class="icnadviser" icon="iconnadviser"></iron-icon><span>{{moreinfoTit}}</span></p>
<p id="moreinfoSub" class="medium">{{moreinfoSub}}</p>
</div>
<div id="masinfoContent" class="flex horizontal layout center-justified redim">
<section class="notoppadding flex">
<paper-input-container id="nomapedeco">
<label>{{labnomape}}</label>
<input id="nomapeinput" is="iron-input">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
<paper-input-container id="empresadeco">
<label>{{labempresa}}</label>
<input id="empresainput" is="iron-input">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
<paper-input-container id="actecodeco">
<label>{{labactecon}}</label>
<input id="actecoinput" is="iron-input">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
<paper-input-container id="tlfdeco">
<label>{{labtlf}}</label>
<input id="tlfinput" is="iron-input">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
<paper-input-container id="maildeco">
<label>{{labemail}}</label>
<input id="mailinput" is="iron-input">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
<paper-input-container id="consultadeco">
<label>{{labconsulta}}</label>
<input id="consultainput" is="iron-input">
<paper-input-error>{{fieldRequired}}</paper-input-error>
</paper-input-container>
</section>
</div>
<div class="horizontal layout" id="masinfoBotones">
<div class="horizontal end-justified layout flex">
<paper-button id="cancelInfoB" raised class="buttonCancel" onclick="goto(0)">{{btcancelar}}</paper-button>
<paper-button id="acceptInfoB" raised class="buttonNeutral" onclick="sendinforeq()">{{btenviar}}</paper-button>
</div>
<paper-spinner id="infospinner" hidden></paper-spinner>
</div>
<paper-toast
id="infoToast"
duration="4000">
</paper-toast>
</div>
</paper-material>
</div>
<div id="whatiscontainer" class="flex horizontal layout center center-justified">
<paper-material class="shadowbox layout vertical" id="whatischadow" elevation="3">
<div>
<div class="titbox justify">
<p id="whatistit" class="big bold center">
<iron-icon class="icnadviser" icon="iconnadviser"></iron-icon><span>{{whatis}}</span>
</p>
</div>
<div horizontal layout center-justified>
<section class="notoppadding">
<p class="medium">{{whatisContent}}</p>
</section>
</div>
</div>
</paper-material>
</div>
</iron-pages>
</div>
</template>
{{loginTitle}}
{{changePassword}}
{{labuser}}
{{errorInputUser}}
{{labpass}}
{{errorInputPass}}
{{labpass}}
{{errorInputPass}}
{{forgpassText}}
{{btentra}}
{{rempassTit}}
{{rempassSub}
{{labemail}}
{{fieldRequired}}
{{btcancelar}}
{{btenviar}}
{{moreinfoTit}
{{{moreinfoSub}
{{labnomape}}
{{fieldRequired}}
{{labempresa}}
{{fieldRequired}}
{{labactecon}}
{{fieldRequired}}
{{labtlf}}
{{fieldRequired}}
{{labemail}}
{{fieldRequired}}
{{labconsulta}}
{{fieldRequired}}
{{btcancelar}}
{{btenviar}}
{{whatis}}
{{whatisContent}
作用
function goto(i){
var maintemplate = document.querySelector('#fulltemplate');
if(i==0){
document.getElementById("pagesubtitle").removeAttribute("hidden");
document.getElementById("lefttopbar").removeAttribute("hidden");
document.querySelector("#iconinfo").removeAttribute("hidden");
maintemplate.pageTitle = "<%= Resources.GlobalResources.TITLE %>";
} else if(i==2){
maintemplate.pageTitle = "<%= Resources.GlobalResources.MASINFORMACION %>";
document.getElementById("pagesubtitle").setAttribute("hidden", true);
document.getElementById("lefttopbar").setAttribute("hidden", true);
document.querySelector("#iconinfo").setAttribute("hidden", true);
}
maintemplate.pageSelected = i;
}
功能转到(i){
var maintemplate=document.querySelector(“#fulltemplate”);
如果(i==0){
document.getElementById(“pagesubtitle”).removeAttribute(“隐藏”);
document.getElementById(“lefttopbar”).removeAttribute(“隐藏”);
document.querySelector(“#iconinfo”).removeAttribute(“隐藏”);
maintemplate.pageTitle=“”;
}else如果(i==2){
maintemplate.pageTitle=“”;
document.getElementById(“pagesubtitle”).setAttribute(“隐藏”,true);
document.getElementById(“lefttopbar”).setAttribute(“隐藏”,true);
document.querySelector(“#iconinfo”).setAttribute(“隐藏”,true);
}
maintemplate.pageSelected=i;
}
有什么办法来解决这个问题吗
谢谢您的时间。您可以尝试使用
this.pageSelected
而不是使用maintemplate的属性,因为“this”引用自定义元素。希望有帮助
另一个选项是选择iron pages元素并直接设置selected属性
this.$.pages.selected = i;
干杯