3

我在我的jsp页面上的表单中使用jqx下拉按钮。

当我将它们设置为以下

<form name="myForm">

    <input type="button" value="one" onclick="validate(this.form);">

        <div style="float: left;" id="dropDownButton">
              <div style="border: none; display: none;" id='jqxTree'>
            <ul>
               <li>
              <input type="button" value="two" onclick="validate(this.form);">
               </li>
               <li>
               <input type="button" value="three" onclick="validate(this.form);">
               </li>
              </ul>
           </div>
        </div>

    <input type="button" value="four" onclick="validate(this.form);">

    </form>

以及以下获得我想要的东西:

$("#dropDownButton").jqxDropDownButton({ width: 90, height: 22, theme: theme });

这样做它会以某种方式将 dropDownButton div 设置为表单之外,并且它显然会抛出错误,说 this.form 是未知的。

如何解决此问题,或者是否可以将外部元素分配回我的表单?

4

1 回答 1

1

没有看到任何 CSS,很难说为什么有些东西可能会错位。可以肯定的一件事是您的输入标签格式不正确。这些应该是自动关闭<input type="button" />的——结尾/>是关键,所以他们不是在寻找结束标签。

我还建议不要使用内联onclick属性来调用验证函数。这一切都可以通过一个简单的 JS 函数来完成。所以这是我提出的修订:

这是清理后的 HTML

<form name="myForm" id="myForm">

    <input type="button" value="one"/>

    <div style="float: left;" id="dropDownButton">
        <div id='jqxTree'>
            <ul>
                <li>
                    <input type="button" value="two"/>
                </li>
                <li>
                    <input type="button" value="three"/>
                </li>
            </ul>
        </div>
    </div>

    <input type="button" value="four"/>

</form>

这里是 JavaScript/jQuery

$(function(){
    //Hide the dropdown with JS, then call the plugin
    $("#dropDownButton")
        .hide()
        .jqxDropDownButton({
            width: 90,
            height: 22,
            theme: theme
        });

    //Save the form to a variable so we only have to select it once
    var $theForm = $("#myForm");

    //Find all the buttons inside the form, then attach a click event
    $theForm
        .find("input[type='button']")
        .on("click",function(){
            //Pass the form into the validate function when a button is clicked
            validate(theForm);
        });

});
于 2013-04-23T02:45:34.307 回答