it-swarm-id.com

Cara menautkan file javascript eksternal dengan mengklik tombol

File javascript ada di Public/Scripts/filename.js. Saya memiliki file templat di templat/form.tmpl.html. Folder root berisi folder Publik dan template

Saya ingin memanggil file javascript di Klik tombol di form.tmpl.htm. 

  <button type="button" value="Submit" onClick="Call the external js file" >

Terima kasih 

26
verdure

Saya harus setuju dengan komentar di atas, bahwa Anda tidak dapat memanggil file, tetapi Anda dapat memuat file JS seperti ini, saya tidak yakin apakah itu menjawab pertanyaan Anda tetapi mungkin membantu ... oh dan saya telah menggunakan tautan alih-alih tombol dalam contoh saya ...

<a href='linkhref.html' id='mylink'>click me</a>

<script type="text/javascript">

var myLink = document.getElementById('mylink');

myLink.onclick = function(){

    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "Public/Scripts/filename.js."; 
    document.getElementsByTagName("head")[0].appendChild(script);
    return false;

}


</script>
32
Mike Sav

Jika Anda ingin tombol Anda memanggil rutin yang telah Anda tulis dalam filename.js Anda harus mengedit filename.js sehingga kode yang ingin Anda jalankan adalah badan dari fungsi. Untuk Anda dapat panggil fungsi, bukan file sumber. (File sumber tidak memiliki titik masuk)

Jika konten saat ini namafile Anda.js adalah:

alert('Hello world');

anda harus mengubahnya ke:

function functionName(){
	alert('Hello world');
}

Maka Anda harus memuat filename.js di header halaman html Anda dengan baris:

<head>
	<script type="text/javascript" src="Public/Scripts/filename.js"></script>
</head>

sehingga Anda dapat panggilan the fungsi terkandung dalam nama file.js dengan tombol Anda:

<button onclick="functionName()">Call the function</button>

Saya telah membuat contoh kecil yang berfungsi . Halaman HTML sederhana meminta pengguna untuk memasukkan namanya, dan ketika dia mengklik tombol, fungsi di dalam Public/Scripts/filename.js disebut lewat string yang dimasukkan sebagai parameter sehingga bahwa popup mengatakan "Halo, <insertedName>!".

Inilah halaman HTML panggilan:

<html>

	<head>
		<script type="text/javascript" src="Public/Scripts/filename.js"></script>
	</head>

	<body>
		What's your name? <input  id="insertedName" />
		<button onclick="functionName(insertedName.value)">Say hello</button>
	</body>

</html>

Dan ini Public/Scripts/filename.js

function functionName( s ){
	alert('Hello, ' + s + '!');
}

23
Fry Simpson

Sangat mungkin, saya melakukan hal serupa berdasarkan contoh Mike Sav. Itu halaman html dan harus ada file test.js eksternal di folder yang sama

contoh.html:

<html>
<button type="button" value="Submit" onclick="myclick()" >
Click here~!
<div id='mylink'></div>
</button>
<script type="text/javascript">
function myclick(){
    var myLink = document.getElementById('mylink');
    myLink.onclick = function(){
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src = "./test.js"; 
            document.getElementsByTagName("head")[0].appendChild(script);
            return false;
    }
    document.getElementById('mylink').click();
}
</script>
</html>

test.js:

alert('hello world')
4
partizanos

Dengan memuat file .js pertama dan kemudian memanggil fungsi melalui onclick, ada sedikit pengkodean dan cukup jelas apa yang terjadi. Kami akan memanggil file JSzipcodehelp.js.

HTML:

<!DOCTYPE html>
<html>
<head>
    <title>Button to call JS function.</title>
</head>
<body>
    <h1>Use Button to execute function in '.js' file.</h1>
    <script type="text/javascript" src="zipcodehelp.js"></script>
    <button onclick="ZipcodeHelp();">Get Zip Help!</button>
</body>
</html>

Dan isizipcodehelp.jsadalah:

function ZipcodeHelp() {
  alert("If Zipcode is missing in list at left, do: \n\n\
    1. Enter any zipcode and click Create Client. \n\
    2. Goto Zipcodes and create new Zip code. \n\
    3. Edit this new client from the client list.\n\
    4. Select the new zipcode." );
}

Semoga itu bisa membantu! Tepuk tangan!

–Ken

3
Kenneth Wagner

Anda bisa melakukan hal berikut.

Katakanlah Anda memiliki file JavaScript bernamamyscript.jsdi folder root Anda. Tambahkan referensi ke file sumber javascript Anda di tag kepala Anda dari file html Anda.

<script src="~/myscript.js"></script>

File JS: (myscript.js)

function awesomeClick(){
  alert('awesome click triggered');
}

HTML

<button type="button" id="jstrigger" onclick="javascript:awesomeClick();">Submit</button>
1
ShellZero

sepertinya, tidak mungkin untuk memanggil fungsi dalam file js eksternal (uji pada chrome Versi 63.0.3239.132). Saya mencobanya dengan banyak cara tetapi tidak bisa. Saya harus menggunakan pendengar acara.

1
Võ Minh

Anda dapat memuat semua skrip Anda di tag head, dan apa pun yang dilakukan skrip Anda dalam kurung fungsi. Tetapi pastikan Anda mengubah ruang lingkup variabel jika Anda menggunakan variabel-variabel di luar skrip.

0
user6200788

Menambahkan skrip dinamis ke kepala Anda dapat menulis fungsi dan menambahkan elemen skrip dengan src jalur file js

0
ganeshradj