是什么导致此javascript代码按其功能运行? [英] what is causing this javascript code to function the way it is?

问题描述

我知道stackoverflow往往会避开文本墙"帖子，但是我已经呆了大约4个小时，无法弄清楚，所以我想提供尽可能多的信息.

I know stackoverflow tends to shy away from "wall of text" posts, but I've been at this for about 4 hours and I can't figure it out, so I wanted to give as much information as possible.

我有一个页面，上面有两个输入表单.每当我将文本添加到第一个文本中时，附加到第二个输入按钮的javascript函数就会运行，并且我不知道为什么.

I have a page with two input forms on it. Whenever I add text into the first one, the javascript function attached to the second input button runs, and I can't figure out why.

在标题中，我有两个脚本:

In my header I have two scripts:

<script type="text/javascript" src="/autocomplete/js/script.js"></script>

其中包含:

function autocomplet() {
    var min_length = 0; // min caracters to display the autocomplete
    var keyword = $('#country_id').val();
    if (keyword.length >= min_length) {
        $.ajax({
            url: 'capoInstantSearch.php',
            type: 'POST',
            data: {keyword:keyword},
            success:function(data){
                $('#country_list_id').show();
                $('#country_list_id').html(data);
            }
        });
    } else {
        $('#country_list_id').hide();
    }
}

// set_item : this function will be executed when we select an item

function set_item(item) {
    // change input value
    $('#country_id').val(item);
    // hide proposition list
    $('#country_list_id').hide();

  $("#capoInfo").load("capoSingleReturn.php?q="+encodeURIComponent(item));  

}

capoInstantSearch.php看起来像这样:

capoInstantSearch.php looks like this:

<?php

function connect() {
    return new PDO('code here to connect'}

$pdo = connect();
$keyword = '%'.$_POST['keyword'].'%';
$sql = "SELECT statement is here....";
$query = $pdo->prepare($sql);
$query->bindParam(':keyword', $keyword, PDO::PARAM_STR);
$query->execute();
$list = $query->fetchAll();
foreach ($list as $rs) {
    // put in bold the written text
    $country_name = str_replace(strtoupper($_POST['keyword']), '<b>'.$_POST['keyword'].'</b>', $rs['quotePartNumber']);
    // add new option
    echo '<li onclick="set_item(\''.str_replace("'", "\'", $rs['quotePartNumber']).'\')">'.$country_name.'</li>';
}
?>

和

<script type="text/javascript" src="/autocomplete/js/script2.js"></script>

其中包含:

function compCheck() {
    var min_length = 0; // min caracters to display the autocomplete
    var bootyTime = $('#comp_id').val();
    if (bootyTime.length >= min_length) {
        $.ajax({
            url: 'capoInstantCompSearch.php',
            type: 'POST',
            data: {bootyTime:bootyTime},
            success:function(data){
                $('#comp_list_id').show();
                $('#comp_list_id').html(data);
            }
        });
    } else {
        $('#comp_list_id').hide();
    }
}

// set_item : this function will be executed when we select an item
function set_item(item) {
    // change input value
    $('#comp_id').val(item);
    // hide proposition list
    $('#comp_list_id').hide();
  $("#compReturn").load("capoCompReturn.php?w="+encodeURIComponent(item));
}

输入框1:

<input id="country_id" type="text" placeholder="Enter a Part Number"
onsubmit="this.value=this.value.toUpperCase()" autocomplete="off" onkeyup="autocomplet()">
<ul id="country_list_id"></ul>

输入框2:

<input id="comp_id" type="text" onkeypress="this.value=this.value.toUpperCase()" 
placeholder="Part Number 2" onkeyup="compCheck()"></h2>
<ul id="comp_list_id"></ul>

最终，应将autocomplet()的内容放入此div

Ultimately, the contents of autocomplet() should be placed into this div

<div id="capoInfo" class="capoData"></div>

而应将compCheck()的内容放入

while the contents of compCheck() should be placed into

<div id="compReturn" class="blueBorder"></div>

当我在第一个输入框中键入文本时，它会填充<ul> country_list_id，当我进行选择时，它会将答案填充到页面的第二个输入框中，然后执行该代码.我不知道为什么这样做，这让我发疯....

When I type text into the first input box, it populates the <ul> country_list_id, and when I make a selection, it populates that answer into second input box on my page, then executes that code. I cannot figure out WHY it is doing this and it's driving me crazy....

推荐答案

这是因为您在全局范围内有两个名为"set_item"的函数

It's because you have two functions that are in the global scope called "set_item"

这篇关于是什么导致此javascript代码按其功能运行?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！