2013-10-27 2 views
0

ListBox에 jqWidgets 샘플을 사용하려고합니다. 코드를 내 index.cshtml 파일에 직접 복사했습니다. 샘플이 어떻게 보이는지 원하는 결과가 표시되지 않습니다. 그것이 나를 보여주는 모든 것은 버튼입니다.JQWidgets가 MVC 4에서 작동하지 않습니다.

다음은 페이지에 대한 링크입니다. 나는 그것을보고 누군가를 위해 내용을 감소 허용 한 : 정말 무슨 일이 잘못보고 볼이 어디서 문제를 해결하는 방법을 잘 모르겠어요 http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxlistbox/jquery-listbox-getting-started.htm

: 여기

https://drive.azurewebsites.net/Question 샘플의 웹 사이트입니다 . Chrome을 사용하고 Inspect 요소를 가져 왔습니다. 스크립트가 검색 중입니다. 스크립트가 제대로

<link rel="stylesheet" href="~/Scripts/jqwidgets/styles/jqx.base.css" type="text/css" /> 
<script type="text/javascript" src="~/Scripts/jqwidgets/jqxcore.js"></script><script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript" src="~/Scripts/jqwidgets/jqxbuttons.js"></script> 
<script type="text/javascript" src="~/Scripts/jqwidgets/jqxscrollbar.js"></script> 
<script type="text/javascript" src="~/Scripts/jqwidgets/jqxlistbox.js"></script> 

<body> 
    <div id='content'> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       var source = [ 
        "Affogato", 
        "Americano", 
        "Bicerin", 
        "Breve", 
        "Café Bombón", 
        "Café au lait", 
        "Caffé Corretto", 
        "Café Crema", 
        "Caffé Latte", 
       ]; 
       // Create a jqxListBox 
       $("#jqxlistbox").jqxListBox({ source: source, width: '200px', height: '200px' }); 
       // disable the sixth item. 
       $("#jqxlistbox").jqxListBox('disableAt', 5); 
       // bind to 'select' event. 
       $('#jqxlistbox').bind('select', function (event) { 
        var args = event.args; 
        var item = $('#jqxlistbox').jqxListBox('getItem', args.index); 
        $("#eventlog").html('Selected: ' + item.label); 
       }); 
       $("#button").jqxButton(); 
       $("#button").click(function() { 
        var item = $('#jqxlistbox').jqxListBox('getSelectedItem'); 
        if (item != null) { 
         alert(item.label); 
        } 
       }); 
      }); 
     </script> 
     <div id='jqxlistbox'> 
     </div> 
     <div style="margin-top: 10px;"> 
     <input id="button" type="button" value="Get Selected Item" /> 
     <div id="eventlog"></div> 
     </div> 
    </div> 
</body> 

답변

관련 문제