菜鸟教程小白 发表于 2022-12-13 13:46:45

javascript - 框架 7 onclick 事件绑定(bind)不起作用


                                            <p><p>我正在使用 <a href="http://framework7.io" rel="noreferrer noopener nofollow">framework7.io</a> .我正在使用他们的框架事件和功能,但 <strong>onclick</strong> 事件未与他们的页面事件 <strong>pageInit</strong> 绑定(bind)。</p>

<p>我正在尝试访问表单数据并使用 <code>formTOJSON</code> 将其转换为 json,如下所示。</p>

<p>JS部分</p>

<pre><code>//on page in it if page load via ajax
$$(document).on(&#39;pageInit&#39;, function() {

    /*========query form=======*/

    var queryForm = app.formToJSON(&#39;#query-form&#39;);
    $$(&#39;#query-submit&#39;).on(&#39;click&#39;, function () {
       console.log(JSON.stringify(queryForm));
    });

});
</code></pre>

<p>HTML 部分</p>

<pre><code>&lt;form id=&#34;query-form&#34;&gt;
                  &lt;div class=&#34;color-error&#34; id=&#34;formErrorField&#34; style=&#34;display: none;&#34;&gt;&lt;/div&gt;
                  &lt;ul&gt;
                        &lt;li&gt;
                            &lt;div class=&#34;item-content&#34;&gt;
                              &lt;div class=&#34;item-inner&#34;&gt;
                                    &lt;div class=&#34;item-input&#34;&gt;
                                        &lt;textarea name=&#34;question&#34; placeholder=&#34;Type Here!&#34;&gt;&lt;/textarea&gt;
                                    &lt;/div&gt;
                              &lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/li&gt;
                  &lt;/ul&gt;
                  &lt;br/&gt;
                  &lt;a href=&#34;#&#34; class=&#34;button button-fill&#34; id=&#34;query-submit&#34;&gt;Submit&lt;/a&gt;
                &lt;/form&gt;
</code></pre>

<p>相同的代码适用于不同的页面加载<strong>(非 ajax)。</strong></p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>实际上在您的代码中绑定(bind)似乎很好。<br/>
将 formToJSON 代码保留在 click 事件句柄 block 中试试这个:</p>

<pre><code>$$(document).on(&#39;pageInit&#39;, function() {
    var queryForm = null;
    $$(&#39;#query-submit&#39;).on(&#39;click&#39;, function () {
   queryForm = app.formToJSON(&#39;#query-form&#39;);
       console.log(JSON.stringify(queryForm));
    });
});
</code></pre>

<p>因为当 PageInit 发生时,根据您的代码,您的 queryForm 变量为空。填写表单后,您想要获取值。所以请保留在 click 事件处理程序中。
希望这会有所帮助。</p></p>
                                   
                                                <p style="font-size: 20px;">关于javascript - 框架 7 onclick 事件绑定(bind)不起作用,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/37915488/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/37915488/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: javascript - 框架 7 onclick 事件绑定(bind)不起作用