Question

我需要帮助显示/隐藏基于我点击空间的小部件

我正在使用datepicker引导程序小部件和其他一些小部件

我的代码是：

    <div class="o_datepicker">

            <t t-set="placeholder" t-value="widget.getParent().node and widget.getParent().node.attrs.placeholder"/>
            <input type="text"
                t-att-name="widget.name"
                t-att-placeholder="placeholder"
                class="oe_datepicker_master oe_simple_date"/>
        <input t-att-id="widget.name" type="text"
                t-att-placeholder="placeholder"
                class="oe_hijri oe_datepicker_master"
                />
    </div>

当我点击div中的<div class="o_datepicker">任何地方时，bootstrap datepicker小部件可见..我想将其限制为仅第一个输入，当我点击第二个输入时，小部件应该是不可见的，因为还有另一个单击第二个输入时打开的小部件。

注意：两个输入必须位于相同的<html> <head> <script> function clickCounter(element) { element.value = parseInt(element.value) + 1; } </script> </head> <body> <input type="button" value="0" onclick="clickCounter(this)"/> <input type="button" value="0" onclick="clickCounter(this)"/> <input type="button" value="0" onclick="clickCounter(this)"/> <input type="button" value="0" onclick="clickCounter(this)"/> <input type="button" value="0" onclick="clickCounter(this)"/> <input type="button" value="0" onclick="clickCounter(this)"/> <input type="button" value="0" onclick="clickCounter(this)"/> </body> </html>

中

由于

Answer 1

您必须在第二个输入点击停止事件传播：

$(".o_datepicker input:last").click(function(event) {
    //Prevents the event from bubbling up the DOM tree, 
    //preventing any parent handlers from being notified of the event.
    event.stopPropagation();
    //Your code here.
});

我希望这会对你有所帮助。

管理小部件的可见性和隐形性

1 个答案: