javascript — отправка формы JQuery генерирует новую форму

У меня есть сценарий JQuery, который передает пользовательский ввод в сценарий PHP в том же файле, а затем отображает результат того, что сценарий PHP делает с вводом. Эта часть отлично работает. Проблема, с которой я столкнулся, заключается в том, что при отправке сценарий JQuery (по крайней мере, я думаю, что это сценарий) также генерирует новое поле отправки под оригиналом.

Я не уверен почему. Сначала я подумал, что это проблема с типом ввода, с асинхронной частью или даже с тем, где у меня была форма в общем коде, но ни один из них, похоже, не играет никакой роли. Я все еще начинающий, и я просто не вижу проблемы.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<form id = "my_form">
verb <input type = "text" id ="word1"/>
<input type = "submit"/></form>
<div id="name"></div>
<script>
$(document).ready(function(){
$("#my_form").on('submit', function(e)
{
e.preventDefault();
var verb = $ ("#word1").val();
var tag = "#Latin ";
var url = "http://en.wiktionary.org/wiki/"+verb+tag;
$.ajax({
url: "Parser.php",
data: {"verb": verb},
type: "POST",
async: true,
success: function(result){
$("#name").html(result);
$("#name").append(url);

}
});
});
});</script>

РЕЗУЛЬТАТ:
результат PHP-скрипта

PHP

<?php

$bank = array();
function endsWith($haystack, $needle) {
return $needle === "" || (($temp = strlen($haystack) - strlen($needle)) >= 0 && strpos($haystack, $needle, $temp) !== false);
}
function check_end_array($str, $ends)
{
foreach ($ends as $try) {
if (substr($str, -1*strlen($try))===$try) return $try;
}
return false;
}
function db_connect() {

static $connection;

if(!isset($connection)) {
$connection = mysqli_connect('127.0.0.1','username','password','Verb_Bank');
}

if($connection === false) {
return mysqli_connect_error();
}
return $connection;
}
function db_query($query) {
$connection = db_connect();
$result = mysqli_query($connection,$query);

return $result;
}

function db_quote($value) {
$connection = db_connect();
return "'" . mysqli_real_escape_string($connection,$value) . "'";
}
$y = false;
if (isset($_POST['verb'])){
$y=db_quote($_POST['verb']);
echo $y;
echo "\n";

$m = db_query("SELECT `conjugation` FROM normal_verbs WHERE (" . $y . ")  LIKE CONCAT('%',root,'%')");
if($m !== false) {
$rows = array();
while ($row = mysqli_fetch_assoc($m)) {
$rows[] = $row;
}
}
foreach ($rows as $key => $value){
if (in_array("first",$value)==true){
echo "first conjugation verb\n";}
$y = $_POST["verb"];
$x = $y;
foreach ($bank as $key => $value)
(series of IF-statements)
}}?>

0

Решение

Как говорит Roamer-1888, проблема заключается в серверной части, вы возвращаете HTML, который также имеет ввод. Вам нужно изменить код, чтобы он возвращал только строку результата, которую вы добавляете в div. Иначе, если это невозможно сделать на стороне сервера, так как это может потребовать изменения большого количества кода, вы можете убрать элемент ввода из результата и затем добавить его в div. Как ниже.

 success: function(result){
var div = document.createElement('div');
div.innerHTML = result;
$(div).find('input').remove();

$("#name").html(div.innerHTML);
$("#name").append(url);

}
1

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]