在javascript停止功能上显示按钮或添加声音

我有可拖动的

div

。当用户停止拖动div时，如何显示确认按钮并播放一些背景声音“确定”呢？此外，如果用户再次开始拖动div，则应降低“确认”按钮的不透明度。因此，单击确认按钮，

'$get（'ajax/update\u position.php'

应该被激活

function make_draggable(elements)
{
    /* Elements is a jquery object: */

    elements.draggable({
        containment:'parent',
        start:function(e,ui){ ui.helper.css('z-index',++zIndex); },
        stop:function(e,ui){

            /* Sending the z-index and positon of the note to update_position.php via AJAX GET: */

            $.get('ajax/update_position.php',{
                  x     : ui.position.left,
                  y     : ui.position.top,
                  z     : zIndex,
                  id    : parseInt(ui.helper.find('span.data').html())
            });
        }
    });
}

---

我希望我正确理解了您的要求：

注释掉不相关的代码以不破坏JSFIDLE

---

在加载文档时，按钮不应可见。只有当他们开始拖动可拖动的div并停止时，按钮才会显示。但是，是的。总的来说，这就是我想要的。@Venky很高兴看到了：）Ajax调用没有发生。@Venky我已经注释掉了它。确保没有语法错误。而且它在JSFIDLE上不起作用。@Venky可能是那里没有定义

zIndex

。

var $button = $("button"); 

function make_draggable(elements) {
    /* Elements is a jquery object: */

    elements.draggable({
        containment: 'parent',
        start: function (e, ui) {
            /*ui.helper.css('z-index', ++zIndex);*/
            // if the user starts dragging the div again, confirm button opacity should be decreased
            $button.hide(1000); // meaning hide the button
        },
        stop: function (e, ui) {
            // When a div is stopped being dragged by the user, how do I display a confirm button and play some background sound "Are you sure"? 

            $button.show(1000);  // display button

            /*Add code to play music here*/
        }
    });
}

$button.click(function () {
    alert(1); // check to make sure function is called
    /* Sending the z-index and positon of the note to update_position.php via AJAX GET: */
    /* removed to not disturb jsfiddle
            $.get('ajax/update_position.php',{
                  x     : ui.position.left,
                  y     : ui.position.top,
                  z     : zIndex,
                  id    : parseInt(ui.helper.find('span.data').html())
            });           */
});

make_draggable($("div"));