gpt4 book ai didi

perl - 如何创建带有操作的 HTML 按钮并使用 PerlScript 将其附加到 DOM?

转载 作者:行者123 更新时间:2023-12-04 06:01:35 24 4
gpt4 key购买 nike

我专门谈论来自 ActiveState 的 IE 嵌入式脚本语言“PerlScript”。

我目前有以下内容,但是当按下按钮 3 时,没有任何 Action 发生。

<html>
<head>
<title>perlscript baby!</title>
</head>

<script language="perlscript" event="onload" for="window">
sub yawn
{
$window->alert("hi!");
}
sub createNew
{
$b = $window->document->createElement('button');
$b->{value} = "button 3";
$b->{onclick} = "yawn()";
$window->alert("Button: " . $b->{outerHTML});
$window->document->body->appendChild($b);
}
sub enable
{
undef $window->document->all('buttn 2')->{disabled};
}
</script>

<body>
<input id='enabler' type='button' value='button 1' onclick='enable()'></input>
<input id='action' type='button' value='button 2' disabled onclick="createNew()"></input>
</body>
</html>

最佳答案

显然,这是一件很难实现的事情。浏览器(在我的例子中是 IE9)期待 onclick 的值属性(从脚本设置时)为函数引用而不是字符串。我们可以通过将您的代码转换为等效的 JavaScript 来证明这一点,如下所示。

<script language="javascript">
function yawn()
{
window.alert("hi!");
}
function createNew()
{
b = window.document.createElement('button');
b.value = "button 3";
b.onclick = "yawn()";
window.alert("Button: " + b.outerHTML);
window.document.body.appendChild(b);
}
function enable()
{
window.document.getElementById("action").removeAttribute("disabled");
}
</script>

如果我们运行这个,第三个按钮会出现,但点击它什么也不做。我们只需要稍作调整就可以在 JavaScript 中实现这一点。

function createNew()
{
// ...
b.onclick = function() { yawn(); };
// ...
}

现在,如果我们将其转换回等效的 perlscript,我们可以看到它仍然不起作用。

sub yawn
{
$window->alert("hi!");
}
sub createNew
{
$b = $window->document->createElement('button');
$b->{value} = "button 3";
$b->{onclick} = sub { $window->yawn(); };
$window->alert("Button: " . $b->{outerHTML});
$window->document->body->appendChild($b);
}
sub enable
{
$window->document->getElementById("action")->removeAttribute("disabled");
}

事实上,它有点糟糕,因为现在,如果你使用你最喜欢的 HTML 调试器来检查按钮 3 元素,没有 onclick处理程序。那么我们可以做些什么来解决这个问题呢?嗯,答案实际上非常简单——不要使用 PerlScript 动态创建元素,而是静态创建它们并使用 PerlScript 隐藏和显示它们。

<html>
<head>
<title>perlscript baby!</title>
</head>
<script language="perlscript">
sub yawn
{
$window->alert("hi!");
}
sub createNew
{
$window->document->getElementById('button3')->style->{display} = "inline";
}
sub enable
{
$window->document->getElementById("action")->removeAttribute('disabled');
}
</script>
<body>

<input id='enabler' type='button' value='button 1'
onclick='javascript:enable();' />

<input id='action' type='button' value='button 2' disabled
onclick='javascript:createNew();' />

<input id='button3' type='button' value='button 3' style='display:none;'
onclick='javascript:yawn();'/>

</body>
</html>

这似乎很好地完成了这项工作,尽管我不确定它是否适合您的用例。当然,这段代码中有一件非常奇怪的事情: onclick每个 input 的处理程序元素明确声明它正在调用一个 JavaScript 函数。显然,这不是真的,因为这些函数实际上是 PerlScript 子例程。但是,如果您删除 javascript:前缀,则永远不会调用处理程序。我认为这进一步凸显了浏览器对 JavaScript 的偏见。

希望有帮助!

关于perl - 如何创建带有操作的 HTML 按钮并使用 PerlScript 将其附加到 DOM?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8857925/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com