Нажав на ссылку запрос на отправку на другой сайт, не обновляя страницу

Question

Вот ситуация: у меня есть малина Pi 2 (она подключена к телевизору), и я запускаю Kodi для воспроизведения фильмов. Я хочу создать свою собственную базу данных фильмов, чтобы я мог просматривать все фильмы на жестком диске extarnal, который подключен к малине. Я узнал, что могу воспроизвести фильм с kodi, отправив запрос на сервер с более узкого компьютера в сети. Например, если я ввожу следующий URL-адрес в веб-браузере на моей машине:

http://192.168.0.102:8080/jsonrpc?request={"jsonrpc":"2.0","id":"1","method":"Player.Open","params":{"item":{"file":"/media/serverhdd/cloud/Movies/Ex Machina/Ex Machina.mkv"}}} 

Фильм Ex Machina (Коди должен быть запущен) начнется. У меня есть следующий код:

<a class = "play_movie" href = "http://192.168.0.102:8080/jsonrpc?request={"jsonrpc":"2.0","id":"1","method":"Player.Open","params":{"item":{"file":"/media/serverhdd/cloud/Movies/Ex Machina/Ex Machina.mkv"}}}">Pleay movie</a> 
     <script type="text/javascript"> 
      $('.play_movie').click(function(){ 
       var movie_url = $(this).attr('href'); 
       $.ajax({ 
        url: movie_url, 
        success: function(data) { 
         alert('done'); 
        } 
       }); 
      }); 
     </script> 

Когда я нажимаю на ссылку, Коди начинает играть в кино, но я собираюсь к этому URL и получить это сообщение:

{ «ID»: "1 "," jsonrpc ":" 2.0 "," result ":" OK "}

То, что я хочу, - это остаться на текущей странице, а не идти по указанному выше URL-адресу. Я проверил здесь и в других местах, и кажется, что я должен быть в состоянии сделать это с AJAX, однако с приведенным выше кодом я перейду к URL-адресу, вместо того, чтобы оставаться на текущей странице.

Не могли бы вы посоветовать, как я могу это сделать?

Было бы благодарен!

С уважением, Иван

Answer 1

Первое решение предложил: Вам просто нужно использовать событие preventDefault функции JQuery. По умолчанию в этой ситуации вводится ссылка.

Альтернативное решение: Хорошо, это не первое решение, которое я представил. Но имея в виду, что правильный код не работает, вы можете попробовать этот код, который исправит его (или взломает).

$('.play_movie').each(function(){ 
    var href = $(this).attr('href'); 
    $(this).attr('hhref', href); 
    $(this).attr('href', 'javascript:void(0)'); 
}); 

$('.play_movie').click(function(event){ 
    event.preventDefault(); 
    var movie_url = $(this).attr('hhref'); 
    $.ajax({ 
     url: movie_url, 
     success: function(data) { 
      alert('done'); 
     } 
    }); 
}); 

Answer 2

Я думаю, что я понял это ... Я изменил дизайн немного ... Вместо того, чтобы использовать ссылку, я думал, что это будет лучше использовать кнопки и жесткий код переменных - IP-адрес и место назначения фильма. Конечно, я буду иметь возможность тоже получить их из базы данных легко, но это только для целей тестирования:

<button>Play movie</button> 

<script> 

    var KodiAddress = 'http://192.168.0.102:8080'; 

    $('button').click(function() { 
     var kodioutput = $(this).attr('href'); 
     var URL = '/media/serverhdd/cloud/Movies/Ex Machina/Ex Machina.mkv'; // Grab Input Value 
     $.ajax({ 
      type: 'GET', 
      url: KodiAddress + '/jsonrpc', 
      dataType: 'jsonp', 
      jsonpCallback: 'jsonCallback', 
      type: 'GET', 
      async: false, 
      data: 'request=' + encodeURIComponent('{"jsonrpc":"2.0","method":"Player.Open","params":{"item":{"file":"' + URL + '"}},"id":"1"}') 
     }) 
     .fail(function(jqXHR, textStatus) { 
      if (jqXHR.status == 200) { 
       alert('done'); 
      } else { 
       alert('fail'); 
      } 
     }); 
    }); 
</script> 

Спасибо всем за глядя на мою проблему!

С уважением, Иван