Question

我有一种数字输入形式，我将默认值分配给。但是，通过为输入分配默认值，现在当我输入并更改输入的实际＆＃34;值＆＃34; 时，.change()事件不会触发。

我已经尝试.val()＆amp; .keypress()但没有运气。

HTML：

<form id="target">
    <h4>% Coal generation:<input type="number"></h4>
    <h4>% Biomass generation:<input type="number"></h4>
    <h4>% Geothermal generation:<input type="number"></h4>
    <input id="submitprofile" type="submit" class="submit" value="Calculate">
</form>

JQuery：

$(document).ready(function(){
    document.getElementById("target").elements[0].defaultValue=Number(studentdata["Coal"]);// 10
    document.getElementById("target").elements[1].defaultValue=Number(studentdata["Biomass"]);//20
    document.getElementById("target").elements[2].defaultValue=Number(studentdata["Geothermal"]);//0
   $( "#target" ).change(function() {
       console.log('form changed');//not happening!
       refreshdisplay();
   });
 });

Answer 1

您必须将更改处理程序分配给表单的输入，如下所示：

 <div class="email-signup" id="email-signup">
                <h:form id="signupForm">
                    <div class="form-group">
                        <h:inputText value="#{userRegister.userName}" placeholder="username" class="input-text full-width" />
                    </div>
                    <div class="form-group">
                        <h:inputText value="#{userRegister.firstName}" placeholder="first name" class="input-text full-width" />
                    </div>
                    <div class="form-group">
                        <h:inputText placeholder="last name" value="#{userRegister.lastName}" class="input-text full-width" />
                    </div>
                    <div class="form-group">
                        <h:inputText id="email" value="#{userRegister.email}" validatorMessage="Wrong formatted email entered" class="input-text full-width" placeholder="email address">
                            <!--    <f:validator validatorId="emailValidator"/> -->
                            <f:validateRegex pattern="^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$" />
                            <f:ajax event="blur" render="emailMessage" />
                        </h:inputText>
                        <h:message id="emailMessage" for="email" style="color:red"/>

                    </div>
                    <div class="form-group">
                        <h:inputSecret id="password" value="#{userRegister.password}" class="input-text full-width" placeholder="password">

                        </h:inputSecret>

                    </div>
                    <!--<h:outputLabel for="confirm" value="Confirm password" />-->
                    <div class="form-group">
                        <h:inputSecret id="confirm" binding="#{confirm}" class="input-text full-width" placeholder="confirm password"/>

                    </div>
                    <div class="form-group">
                        <div class="checkbox">
                            <h:outputLabel>
                                <h:selectBooleanCheckbox/> Tell me about Chameleon news
                            </h:outputLabel>
                        </div>
                    </div>
                    <div class="form-group">
                        <p class="description">By signing up, I agree to Chameleon's Terms of Service, Privacy Policy, Guest Refund Policy, and Host Guarantee Terms.</p>
                    </div>
                    <h:commandButton value="SIGNUP" class="full-width btn-medium">
                        <f:ajax execute="signupForm" render="outputMessage" valueChangeListener="#{userRegister.getCallUserRegisterService}" onevent="showSignUpMessage" />
                        <h:outputText class="signup_message" id="outputMessage" value="#{userRegister.message !=null ? userRegister.message : ''}"/>
                    </h:commandButton>
                </h:form>
   </div>

e.g。在这里：http://jsfiddle.net/fhc3fywc/1/

如果您确实想在每次输入数字时调用$( "#target :input" ).change(function() { console.log('form changed');//not happening! refreshdisplay(); }); - 函数，请将refreshDisplay替换为.change。我建议使用setTimeout或类似的东西为此添加延迟，导致添加例如＆＃34; 111＆＃34;直接进入表单字段会触发三次，每次输入一次。

Answer 2

尝试阅读input字段内部的更改，而不是form

 $( "#target").find("input").on("change", function() {
       console.log('form changed');
       //refreshdisplay();
   });

.change（）由于默认值

2 个答案: