Question

我的css文件中是否可以执行类似的操作？：

.myclass:after{
   content:"click me";
   onclick:"my_function()";
 }

我想在css样式表中添加myclass可点击文字的所有实例后。

Answer 1

我的css文件中是否可以执行[见上面的代码]？

没有

要问的重要问题是为什么。

HTML 可控制网页中的数据。任何CSS或JS都是通过HTML指定的。它是模型。

CSS 控制样式，CSS与HTML或JavaScript之间没有链接。它是查看。

JavaScript 可以控制网页中的交互，并且可以挂钩任何和所有DOM节点。它是控制器。

由于这个MVC结构：HTML属于.html个文件，CSS属于.css个文件，JS属于.js个文件。

CSS伪元素不会创建DOM节点。 JavaScript无法直接访问CSS中定义的伪元素，也无法将事件附加到所述伪元素。

如果您已经设置了固定的结构，并且无法添加在HTML中生成新链接所需的其他内容，JavaScript可以动态添加必要的新元素，然后可以通过CSS设置样式

jQuery使这很简单：

$('<span class="click-me">click me</span>').appendTo('.myclass').click(my_function);

Answer 2

那么，

使用expresison它实际上可能只适用于Internet Explorer。

否则：

没有。根本不是，那不是css的制作和意图。

Answer 3

如果jQuery可以完成某些事情，那么可以肯定的是，如果没有这样做的话。让我们看一下数据模型：

<div id="container">
<div id="hasblock" onclick='clickFunc(this, event)'></div>
</div>

我们需要一些样式表：

<style>
div#container { width:100px; height:50px;position relative; border:none;}
div#hasblock {width:100px; height:50px;position absolute;border:solid black;}
div#hasblock::after {content:"Click me"; position: absolute; border:solid red;
top:80px;left:0px;display:block;width:100px;height:20px; font-size:18px;}
</style>

和代码：

<script>
function clickFunc(his, event)
{if (event.clientY>his.clientHeight){console.log("It was a click");};    }
</script>

Answer 4

使用jQuery的After：

http://jsfiddle.net/PCRnj/

Answer 5

不，但你可以这样做

在html文件中添加此部分

<div class="arrow">
</div>

在CSS中你可以这样做

.myclass div.arrow{
   content:"click me";
   onclick:"my_function()";
 }

希望它能帮到你

之后使用css伪元素添加onclick

5 个答案: