简体   繁体   中英

Jade Not Executing Inline onClick Javascript

I am completely new to Jade and trying to get a simple inline button click to throw up an alert.

I have layout.jade

doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content

Then in index.jade I have

extends layout

block content
  h1= title
  p Welcome to #{title}
  p Adam

  input(type="text", id="wordToChange")
  input(type="text", id="wordToChangeToo")
  button(type="submit", onClick="javascript:alert('Adam!!')")

I've tried several variations of the alert line. Ideas?

Html that is generated.

<head>
    <title>Adam</title>
    <link href="/stylesheets/style.css" rel="stylesheet"></head>
    <body>

        <p>Welcome to Adam</p>
        <p>Adam</p>
        <input id="wordToChange" type="text">
            <input id="wordToChangeToo" type="text">
                <button onclick="javascript:alert('Adam!!')" type="submit"></button>

UPDATE: Apparently it's limited to IE? It works and alerts in FF. Must be a support issue in IE.

The answer is...security settings. The IE I was using had security settings on high that disabled JavaScript.

You can try to use the HTML to Jade converter: http://html2jade.aaron-powell.com/

I had the same exact problem you're having, and the converter helped me solved my problems.

The string you pass to onclick will be eval 'd, essentially. javascript:alert('Adam!!') isn't valid JavaScript.

Have you tried button(type="submit", onClick="alert('Adam!!')") in your Jade, which should render to <button onclick="javascript:alert('Adam!!')" type="submit"></button> ?

You'll also likely want something inside of your button so that you can see it better.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM