在可編輯的x中隱藏/顯示日期選擇器時顯示/隱藏按鈕

Question

我有這個HTML可編輯X

<a class="x-editable  editable editable-click" href="#"
   data-custom-params="{&quot;inPlanId&quot;:64,&quot;inPlanVid&quot;:15}" 
   data-date-format="mm-yyyy" data-disabled="false"
   data-emptytext="Specify date" data-name="inDate"
   data-placeholder="mm-yyyy" data-type="date"
   data-url="/synergy/planner/submitInPlacePlanSimulateDate.action"
   data-value="12-2015" style="display: inline;">12-2015</a>

用來創建x可編輯的日期選擇器，如何添加事件以顯示/隱藏日期選擇器？

我試圖在顯示編輯時查找輸入框，但這不起作用：

$editEl.on('hidden', function() {
    console.log('hidden');
    console.log($editEl);
});
$editEl.on('shown', function() {
    var $container = $editEl.siblings('.editable-container');
    var $buttons = $container.find('.editable-buttons');
    $container.find('input').on('hide', function() {
        console.log('hide');
        $buttons.show();
    }).on('show', function() {
        console.log('show');
        $buttons.hide();
    });
    console.log($container.find('input'));
});

顯示和隱藏事件被觸發，但隱藏/顯示不觸發。

Answer 1

x可編輯的添加類datepicker-open因此您可以使用以下方法隱藏按鈕：

.datepicker-open + .editable-container .editable-buttons {
   display: none;
}