HTML5 Форма Отправить

Question

Я пытаюсь получить форму для отправки действия на ip-адрес без открытия ip-адреса.

Итак, когда я нажал кнопку отправки, я хочу, чтобы она отправила почтовую команду в ip (в данном случае 192.168.0.1) и просто обновила текущую страницу.

<div data-role="main" class="ui-content"> 
<form method="POST" action="http://192.168.0.1/"> 
<input type="submit" name="parser" value="thisguy"/> 
</form> 
</div> 

Мой скрипт, который работает на отправить:

<script src="http://ajax.googleapis.com/ajax/liubs/jquery/1.9.1/jquery.min.js"></script> 
<script language="javascript" type="text/javascript"> 
    $('form.ajax').on('submit', function() { 
     var that = $(this), 
      url = that.attr('action'), 
      method = that.attr('method'), 
      data - {}; 

     that.find('[name]').each(function() { 
      var that = $(this), 
       name = that.attr('name'), 
       value = that.val(); 
      data[name] = value; 

      $.ajax({ 
       url: url, 
       type: method:, 
       data: data, 
       success: function(response) {} 

      }); 

     }); 

     return false; 
    }); 
</script> 

Сейчас он представляет пост и пытается открыть 192.168.0.1 как веб-страницу. Может ли кто-нибудь помочь мне, предоставив код с объяснением или указав мне на команду?

Любая помощь приветствуется.

Answer 1

Вы должны предотвратить действие по умолчанию (используя e.preventDefault())

$('form.ajax').on('submit', function(e) { 
    e.preventDefault(); // Prevent default submit action (that is, redirecting) 
    var that = $(this), 
     url = that.attr('action'), 
     method = that.attr('method'), 
     data = {}; 

    that.find('[name]').each(function() { 
     var that = $(this), 
      name = that.attr('name'), 
      value = that.val(); 
     data[name] = value; 

     $.ajax({ 
      url: url, 
      type: method:, 
      data: data, 
      success: function(response) {} 

     }); 

    }); 

    return false; 
}); 

Answer 2

Ну, вы можете обновить эту страницу после того, как POST выполняется в success методе

success: function(response) { 
    window.location.reload(); 
} 

Также не забудьте отключить поведение формы по умолчанию с

$('form.ajax').on('submit', function(event) { 
    event.preventDefault(); 
    . 
    . 
}); 

Смотрите documentation для получения дополнительной информации

Answer 3

Я сделал исправление для вашего кода.

<script language="javascript" type="text/javascript"> 
    $('form').on('submit', function(e) { 
     e.preventDefault(); 
     var that = $(this), 
      url = that.attr('action'), 
      method = that.attr('method'), 
      data = {}; 

     that.find('[name]').each(function() { 
      var that = $(this), 
       name = that.attr('name'), 
       value = that.val(); 
      data[name] = value; 

      $.ajax({ 
       url: url, 
       type: method, 
       data: data, 
       success: function(response) {} 

      }); 

     }); 

     return false; 
    }); 
</script> 

Answer 4

Чтобы включить отладку, вы должны обернуть весь представить обработчик в попытке/поймать, потому что без него, ошибки будут вызывать по умолчанию обработчик для отправки формы, маскируя ошибки. После try/catch вы можете вернуть false, поэтому страница остается помещенной.

<script src="http://ajax.googleapis.com/ajax/liubs/jquery/1.9.1/jquery.min.js"></script> 
<script language="javascript" type="text/javascript"> 
    $('form.ajax').on('submit', function() { 
     try { 
      var that = $(this), 
       url = that.attr('action'), 
       method = that.attr('method'), 
       data - {}; 

      that.find('[name]').each(function() { 
       var that = $(this), 
        name = that.attr('name'), 
        value = that.val(); 
       data[name] = value; 

       $.ajax({ 
        url: url, 
        type: method:, 
        data: data, 
        success: function(response) {} 

       }); 

      }); 
     } 
     catch (err) { 
      console.log('submit handler error: ' + err.message); 
     } 

     return false; 
    }); 
</script> 

Answer 5

Вы только что пару опечатка, как - вместо = и дополнительного :, иначе ваш код хорошо, ниже работает пример.

$(function(){ 
 
    $('form.ajax').on('submit', function() { 
 
     var that = $(this), 
 
      url = that.attr('action'), 
 
      method = that.attr('method'), 
 
      data = {}; 
 

 
     that.find('[name]').each(function() { 
 
      var that = $(this), 
 
       name = that.attr('name'), 
 
       value = that.val(); 
 
      data[name] = value; 
 

 
      $.ajax({ 
 
       url: url, 
 
       type: method, 
 
       data: data, 
 
       success: function(response) { 
 
       alert('posted') 
 
       } 
 

 
      }); 
 

 
     }); 
 

 
     return false; 
 
    }); 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
<div data-role="main" class="ui-content"> 
 
<form method="POST" action="http://192.168.0.1/" class="ajax"> 
 
<input type="submit" name="parser" value="thisguy"/> 
 
</form> 
 
</div> 
 
My script that runs on submit: