Question

如何从onchange事件创建一个全局变量，以便我的js页面中的每个函数都可以使用变量中的值？任何人都可以提供有效的示例代码。

来自 main.php 的

onchange="showTable()"事件：

<?php
    $linkID = @ mysql_connect("localhost", "root", "Newpass123#") or die("Could not connect to MySQL server");
    @ mysql_select_db("seatmapping") or die("Could not select database");
    $dbname = "seatmapping";
    $sql = "SHOW TABLES FROM $dbname where tables_in_seatmapping!='userauth'";
    $result = mysql_query($sql);
    $tableNames= array();

    while ($row = mysql_fetch_row($result)) {
        $tableNames[] = $row[0];
    }

    echo '<select name="tables" id="tables" onchange="showTable(this.value)">'; 
    echo '<option class="placeholder" selected disabled>Layouts</option>';
    foreach ($tableNames as $name){
        echo '<option value="'. $name.'">'.$name.'</option>';
    }
    echo '</select>';
?>

来自 main.php 的

onclick="showAvailable()"事件：

<div class="sliderContainer">

    <div id="slider">
        <a class="ui-slider-handle" href="#">Start</a>
        <a class="ui-slider-handle" href="#">End</a>
    </div>

    <p>
    <a id="timer"><span class="slider-time">10:00 AM</span> to <span class="slider-time2">12:00 PM</span></a>

    <a href="#" id="checkAvailable" onclick="showAvailable()">Avail</a>
    <a href="#" id="resetAvailable" onclick="resetAvailable()">Reset</a></p>

</div>

我在.js页面中的功能：

var tableName;

function showTable(tableName){
  if (window.XMLHttpRequest){
    xmlhttp=new XMLHttpRequest();
  }
  else{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
      document.getElementById("showLayout").innerHTML=xmlhttp.responseText;
      tableName = xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","seatmap.php?tableName="+tableName,true);
  xmlhttp.send();
}

function showAvailable(){
  var startShift = $('#slider').slider("values", 0);
  var endShift = $('#slider').slider("values", 1);

  if (window.XMLHttpRequest){
    xmlhttp=new XMLHttpRequest();
  }
  else{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
      document.getElementById("showLayout").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","seatmap.php?startShift="+startShift+"&endShift="+endShift+"&tableName="+tableName,true);
  xmlhttp.send();
}

以下是 seatmap.php 的片段，它太长了，但我对showAvailable和showTable使用了$ tableName。我也在查询中使用它：

<?php

$startSlider=intval($_GET['startShift']);
$endSlider=intval($_GET['endShift']);
$tableName = strval($_GET['tableName']);

$linkID = @ mysql_connect("localhost", "root", "Newpass123#") or die("Could not connect to MySQL server");
@ mysql_select_db("seatmapping") or die("Could not select database");

/* Create and execute query. */
$query = "SELECT rowId,columnId,status,name,seatid,startShift,endShift from $tableName group by seatid order by rowId, columnId desc";
$result = mysql_query($query);
$prevRowId = null;
$seatColor = null;
$tableRow = false;

//echo $result;
echo $tableName;

我想要的是如何使onchange = showTable（this.value）中的值成为全局变量，以便我可以在函数showAvailable中使用它并将其传递给php页面。任何形式的帮助表示赞赏。提前谢谢。

Answer 1

在函数showTable()之前创建变量，例如var global_var;，然后在showTable()中分配值，然后您可以在showAvailable()中使用它，但请记住检查它是否为空。

编辑：你的.js现在应该是这样的（你覆盖了一些变量）：

var tableName;

function showTable(localTable){
  if (window.XMLHttpRequest){
    xmlhttp=new XMLHttpRequest();
  }
  else{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
      document.getElementById("showLayout").innerHTML=xmlhttp.responseText;
      tableName = localTable;
    }
  }
  xmlhttp.open("GET","seatmap.php?tableName="+localTable,true);
  xmlhttp.send();
}

function showAvailable(){
  var startShift = $('#slider').slider("values", 0);
  var endShift = $('#slider').slider("values", 1);

  if (window.XMLHttpRequest){
    xmlhttp=new XMLHttpRequest();
  }
  else{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
      document.getElementById("showLayout").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","seatmap.php?startShift="+startShift+"&endShift="+endShift+"&tableName="+tableName,true);
  xmlhttp.send();
}

Answer 2

您可以通过向窗口对象添加变量来创建全局变量，并且它对所有函数都可见。

window.globalValue = "some value";

但这不是最好的方法，我们应该将全局变量保持在最低限度。最佳做法是 - 在全局中创建命名空间将变量添加到该全局命名空间。

通过这种方式，您可以保持全局清洁，并且代码更易于维护。

window.Namespace = {};
Namespace.varOnChange = "some value";

我想你要找的是 -

var myNamespace = {};

function showTable(tableName){
 if (window.XMLHttpRequest){
    xmlhttp=new XMLHttpRequest();
 }
 else{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
        document.getElementById("showLayout").innerHTML=xmlhttp.responseText;
        myNamespace.name = xmlhttp.responseText;
    }
 }
 xmlhttp.open("GET","seatmap.php?tableName="+tableName,true);
 xmlhttp.send();
}

从onchange事件创建一个全局变量

2 个答案: