无法阅读财产'价值'未定义的onchange事件

时间:2015-01-13 22:57:19

标签: ajax json

我使用包含数据的json文件处理Ajax。我想要的只是通过我设计的某种形式的ajax检索数据

这是json文件:

{
  "movies":[
    {
      "title":"Thegodfather",
      "year":"1972",
      "genre":"Drama",
      "directory":"franl stploen"
    },
    {
      "title":"superBad",
      "year":"2007",
      "genre":"comedy",
      "directory":"franl stploen"
    },
    {
      "title":"The Departed",
      "year":"2006",
      "genre":"Drama",
      "directory":"franl stploen"
    },
    {
      "title":"The Expandalbes",
      "year":"2010",
      "genre":"Action",
      "directory":"Silvster stalone"
    },
    {
      "title":"Batman",
      "year":"2008",
      "genre":"Acion",
      "directory":"franl stploen"
    }
  ]
}

html代码非常简单:

<body onload="getmovietitles()">
  <div id="container"><h1>My Favorites's Movies</h1></div>  
  <div id="movietitle"></div> 
  <br />
  <div id="movieinfo"></div>


  <pre>
    <script>
    function getmovietitles() {
        var xmlhttp;
        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {// code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                var jsondata = JSON.parse(xmlhttp.responseText);
                var movies = jsondata.movies;
                var output = '<form>';
                output +='<select id="movie_select" onchange="movieSelect()">';

                for (var i=0; i < movies.length;i++){
                    output +='<option value="'+i+'">'+movies[i].title+'</option>';
                }

                output += '</select>';
                output += '</form>';
                document.getElementById("movietitle").innerHTML = output;
            }
        }

        xmlhttp.open("GET","movies.json",true);
        xmlhttp.send();
    }


    function movieSelect() {
        var selectbox = document.getElementById("movie_select");
        var movieindex = selectbox.options[selectbox.selectedindex].value;

        getmovieinfo(movieindex);
    }   

    function getmovieinfo(i) {
        var xmlhttp;
        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {// code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                var jsondata = JSON.parse(xmlhttp.responseText);
                var movies = jsondata.movies;
                var output='';
                output +='<li>Year: '+movies[i].year+ '</li>';
                output +='<li>Genre: '+movies[i].genre+ '</li>';
                output +='<li>Directory: '+movies[i].directory+ '</li>';
                document.getElementById('movieinfo').innerHTML = output;
            }
        }
        xmlhttp.open("GET","movies.json",true);
        xmlhttp.send();
    }
    </script>
  </pre>  

脚本功能存在问题,但我不知道它在哪里。

我只想知道问题在哪里以及为什么没有运行?

1 个答案:

答案 0 :(得分:0)

错字:

var movieindex = selectbox.options[selectbox.selectedindex].value;

应该是:

var movieindex = selectbox.options[selectbox.selectedIndex].value;