Question

基于搜索，我遇到了这个stackoverflow线程'Is it possible to ping a server from Javascript?'，并决定遵循trante的jfiddle示例。它适用于我需要它与jquery和CSS部分一起在html代码所在的页面中。

我的问题是，并且想看看是否有人可以帮助我，是当我创建一个.js文件和.css并在html的标题中引用它们时，该函数不起作用。

所以这就是我想要实现的目标。 - .js文件中的jquery - .css文件中的样式表 - html页面中的HTML输出

这是trante的jfiddle示例：http://jsfiddle.net/GSSCD/203/

这是我的html示例参考：

    <!DOCTYPE html>
     <html lang="en">
      <head>
       <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="">
        <meta name="author" content="">
        <link rel="icon" href="../favicon.ico">
        <link rel="stylesheet" href="dist/css/bootstrap.min.css"/>
        <link rel="stylesheet" href="dist/css/panel_dropdown.css"/> 
        <link rel="stylesheet" href="dist/css/ping_response.css"/>
        <script type="text/javascript" src="dist/js/jquery-2.0.3.min.js"></script>
        <script type="text/javascript" src="dist/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="dist/js/modals.js"></script>    
        <script type="text/javascript" src="dist/js/ping-function.js"></script>     

      <title>Test Ping</title>
     </head>
     <body>
      <ul data-bind="foreach:servers">
       <li> <a href="#" data-bind="text:name,attr:{href: 'http://'+name}">tester</a> 
       <span data-bind="text:status,css:status"></span>
       </li>
      </ul>
     </body>

谢谢，

卡斯滕

Answer 1

你的小提琴使用Knockout.js，而我看不到你的HTML使用它。您的问题的答案取决于您是否愿意使用Knockout JS，或者您只想在JQuery中使用相同的功能？

Answer 2

@Alexander 这是我所做的，我删除了对jquery的引用并下载了knockout-3.2.0.js并在html中引用了它。我将淘汰赛和.js文件ping函数放在远离jquery的不同文件夹中。

@epascarello 我把引用从头部移到了身体上。我先用jfiddle测试了它。

无论如何，现在这里是html代码，我仍然遇到服务器没有显示的问题，只有测试人员在页面上显示。

    <!DOCTYPE html>
    <html lang="en">

       <head>

        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="">
        <meta name="author" content="">
        <link rel="stylesheet" href="dist/css/bootstrap.min.css"/>
        <link rel="stylesheet" href="dist/css/ping_response.css"/>


        <title>Test Ping</title>
       </head>


       <body>

        <script type="text/javascript" src="dist/js/knockout-3.2.0.js"></script>
        <script type="text/javascript" src="dist/ko_js/ping-function.js"></script>

        <ul data-bind="foreach:servers">
         <li> <a href="#" data-bind="text:name,attr:{href: 'http://'+name}">tester</a> 
         <span data-bind="text:status,css:status"></span>
         </li>
        </ul>

       </body>

谢谢，

卡斯滕

Answer 3

我已解决了我的问题。感谢大家帮助指导我朝着正确的方向前进。

我将引用放在html的末尾，现在工作正常。

    <!DOCTYPE html>
    <html lang="en">

    <head>

      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <meta name="description" content="">
      <meta name="author" content="">
      <link rel="stylesheet" href="dist/css/bootstrap.min.css"/>
      <link rel="stylesheet" href="dist/css/ping_response.css"/>


     <title>Test Ping</title>
   </head>


   <body>

    <ul data-bind="foreach:servers">
     <li> <a href="#" data-bind="text:name,attr:{href: 'http://'+name}">tester</a> 
     <span data-bind="text:status,css:status" style="margin-left:50px"></span>
     </li>
    </ul>

   </body>

   <script type="text/javascript" src="dist/ko_js/knockout-3.2.0.js"></script>
   <script type="text/javascript" src="dist/ko_js/ping-function.js"></script>

谢谢，卡斯滕

Ping要在HTML上显示的功能

3 个答案: