PHP Javascript無法在PHP模式之外訪問回顯的元素ID

Question

謙虛的應用程序，如果這是一個愚蠢的問題，但我無法為自己的生活弄清楚這里出了什么問題。

我在php模式下有一個echoed元素：

echo'<select name="picks" id="winner">';
            echo'<option value="'.$row['team1'].'">'.$team1.'</option>';
            echo'<option value="'.$row['team2'].'">'.$team2.'</option>';
    echo'</select>';

現在在 php 之外，我嘗試做一個基本的javascript GET：

document.getElementById("winner");

但是，無法訪問元素嗎？我是否在這里遺漏了一些東西，是否無法獲取回顯的元素ID？

Answer 1

在執行元素選擇之前，應確保至少已加載DOM。 如果您可以使用jQuery，那么這就像以下操作一樣簡單，您可以將該腳本放在head或body任何位置：

$(document).ready(function() {
    // Perform any selects on the DOM
});

JS

<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function() {
    // The DOM is loaded and ready to be selected
    var select = document.getElementById("winner");
    var optionText = select.options[select.selectedIndex].text;
    var optionValue = select.options[select.selectedIndex].value;
});
</script>

當然，您也可以使用jQuery執行DOM選擇：

<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function() {
    // The DOM is loaded and ready to be selected
    var optionText = $("#winner option:selected").text();
    var optionValue = $("#winner option:selected").val();
});
</script>

---

另一種可能性

如果$row ， $team1或$team2沒有定義，你有PHP錯誤和通告打開，然后將HTML將呈現如下所示：

<select name="picks" id="winner"><b>E_NOTICE : </b> type 8 -- Undefined variable: row -- at line 4<br /><b>E_NOTICE : </b> type 8 -- Undefined variable: team1 -- at line 4<br />
    <option value=""></option><b>E_NOTICE : </b> type 8 -- Undefined variable: row -- at line 5<br /><b>E_NOTICE : </b> type 8 -- Undefined variable: team2 -- at line 5<br />
    <option value="" selected="selected"></option>
</select>

但是，如果您關閉了 PHP錯誤和警告，則會看到類似以下的內容：

<select name="picks" id="winner">
    <option value=""></option>
    <option value="" selected></option>
</select>

如果您無法訪問所選HTML中的選項值（因為它們為空），那么這將是開始調查的良好步伐。

Answer 2

使用JQUERY，您可以嘗試以下操作：

// I have used mouse down event for demo purpose.
$(document).delegate('#winner', 'mousedown', function ()
{
  alert('hi');
});

Answer 3

嘗試訪問所選ID的值。我正在給演示小提琴演示小提琴 document.getElementById("winner").value;

Answer 4

回送JS代碼很常見，但是有以下幾種可能性：

1-您放置document.getElementById("winner"); 在php創建該元素之前。

2-腳本標記中存在語法錯誤，這會導致錯誤，並且無法進行選擇。

Answer 5

由於php部分將在頁面加載之前可用，因此您可以像這樣：

<?php 
$row['team1']=1;$team1='India';$row['team2']=2; $team2='SA';
echo'<select name="picks" id="winner">';
echo'<option value="'.$row['team1'].'">'.$team1.'</option>';
echo'<option value="'.$row['team2'].'">'.$team2.'</option>';
echo'</select>';
    ?>
<script>

console.log(document.getElementById("winner"));//see this in console.

</script>