не может получить переменную из приглашения в качестве функции обратного вызова

Question

Вкл. button щелкните правой кнопкой мыши мне нужно:
- скрыть кнопку
- , затем показать приглашение
- записать значение приглашения
- получить значение в консоли

function a_ren(){
	var a = 'lorem';
	$('.cmenu').hide(function(){var res = prompt('RENAME', a);});
	console.log(res);
}

$(document).on('contextmenu', 'button', function(e){
    e.preventDefault();
    a_ren();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class='cmenu'>CLICK</button>

Две проблемы:
- ошибка консоли - res не определена
- здесь на SO появляется окно с приглашением, но на моемстранице (chrome, localhost) окно подсказки не появляется вообще.

Любая помощь?

Answer 1

res не определено, потому что вы объявляете его внутри функции hide и пытаетесь распечатать его вне его (не в области видимости).Поместите журнал консоли в функцию, и она должна решить ее.

function a_ren(){
	var a = 'lorem';
	$('.cmenu').hide(function(){
    var res = prompt('RENAME', a);
    console.log(res);
  });
}

$(document).on('contextmenu', 'button', function(e){
    e.preventDefault();
    a_ren();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class='cmenu'>CLICK</button>

Answer 2

Проблема заключается в том, что область действия var res находится внутри обратного вызова hide complete, даже если вы объявите res вне функции, вы не получите значение из приглашения, так как обратный вызов hide complete является асинхронным, поэтому вам нужно обработатьрезультат запроса внутри самого обратного вызова, см. следующий код

function a_ren() {
	var a = 'lorem';
	$('.cmenu').hide(function () {
		var res = prompt('RENAME', a);
		process_prompt_result(res);
        // scope of res ends here, its undefined outside this function
	});
}

$(document).on('contextmenu', 'button', function (e) {
	e.preventDefault();
	a_ren();
});

function process_prompt_result(result) {
	// do something thing with result value from prompt
	console.log(result);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class='cmenu'>CLICK</button>

Answer 3

Причина, по которой res не определена, заключается в том, что функция, переданная в hide(), не запускается до тех пор, пока не завершится анимация скрытия, но console.log(res); вызывается без ожидания.Кроме того, как отметил Рам Сегев, в функции обратного вызова hide определено res, так что это единственное место в области видимости (доступное).

Что касается подсказки, не появляющейся, попробуйте изменить

$(document).on('contextmenu', 'button', function(e){

до

document.querySelector('button').addEventListener('contextmenu', (e) => {