Question

我正在尝试为svg实现mousewheel事件。我使用以下代码。如果我使用-I $(NR_DIR) -I/APP/MATLAB/R2013a/extern/include，这可以正常工作，但如果我使用svg id $(document).bind()则无法正常工作。我希望鼠标滚轮只能在svg内部工作。怎么弄？

svgmain

Answer 1

使用以下函数将事件绑定到svg元素。

 $(document).on('mousewheel', "#svgmain", function() {
   // your code here 
  });

下面的工作代码。

<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
  </script>
  <script>
    $(document).on('mousewheel', "#svgmain", function() {
      $("#log").text("pageX: " + event.pageX + ", pageY: " + event.pageY);
    });
  </script>
</head>

<body>
  <div id="log"></div>
  <svg id="svgmain" xmlns="http://www.w3.org/2000/svg" version="1.1" style="background-color:blue;">
    <g id="g">
      <circle id="circle" cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
    </g>
  </svg>
</body>

</html>

jQuery：svg的Mousewheel事件

1 个答案: