راکت
حل
13 پاسخ

لینکدار کردن دکمه های button-submit و input-submit در html

سلام یه سوال مبتدیانه راجبه html داشتم.
چطور میتونم در یک فرم با استفاده از اینپوت سابمیت کاری کنم وقتی روش کلیک شه بره تو یه سایت دیگه؟
همینطور در تگ باتن سابمیت چطوریه؟
من با تگ باتن به همچین چیزی رسیدم درسته؟
(هنوز css رو فرانگرفتم)


ثبت پرسش جدید
علیرضا
علیرضا
@alireza.gh147csc4 سال پیشمطرح شد
1

سلام دوست من اگه منظورت اینه که با کلیک روی دکمه هدایت بشه به یه صفحه دیگه اون صحفه رو بساز بعد به اون باتن خودت تگ لینک ادرسشو درست بده فقط کلیک کنی میره به اون صفحه که ادرس دادی وسلام.


معین
معین
@amirrezaraadi134 سال پیشمطرح شد
1

سلام خوبی ببین تگ button با تگ فرم میارن خود
button توانایی لینک گرفتن نداره


محمد وزانی
محمد وزانی
تخصص :برنامه نویسی
@mohammad.vzn4 سال پیشمطرح شد
0

سلام عزیز، مرسی بابت راهنمایی.❤️🙂
اره متوجهم منم باتن رو توی فرم استفاده کردم ولی توی اسکرین شات فقط از همون باتن شات گرفتم.


علیرضا
علیرضا
@alireza.gh147csc4 سال پیشمطرح شد
1

سلام دوست من اگه منظورت اینه که با کلیک روی دکمه هدایت بشه به یه صفحه دیگه اون صحفه رو بساز بعد به اون باتن خودت تگ لینک ادرسشو درست بده فقط کلیک کنی میره به اون صفحه که ادرس دادی وسلام.


علیرضا
علیرضا
@alireza.gh147csc4 سال پیشمطرح شد
2

دوست من این شمارمه اگه سوالی داشتی و در حد سواد من بود خوشحال میشم کمکی کنم
09026271850


محمد وزانی
محمد وزانی
تخصص :برنامه نویسی
@mohammad.vzn4 سال پیشمطرح شد
0

چشم شاید بعدا توی تلگرام مزاحم شدم. ❤️


علیرضا
علیرضا
@alireza.gh147csc4 سال پیشمطرح شد
1

تلگرام ندارم متاسفانه دوست من واتساپ


محمد وزانی
محمد وزانی
تخصص :برنامه نویسی
@mohammad.vzn4 سال پیشمطرح شد
0

چشم متشکرم. 🙏🏻


محمد زورمند
محمد زورمند
تخصص :react developer
@SpyStar00034 سال پیشمطرح شد
2

سلام برای این موضوع باید کارهای زیر رو انجام بدی :

1 - یه فایل با فرمت html که میخای با کلیک شدن بره به اون رو میسازی مثلا فرض می کنیم اسم فایل اصلی index.html باشه و فایل دوم about.html ! که میشه اینطور

2 - حالا type دکمه button رو که داخل تگ فرم هست رو میزاری submit و داخل تگ فرم یک اتریبیوت با نام action رو با مقدار نام about.html مینویسی نتیجه میشه این :

        <form action="./about.html">

            <button type="submit"> برو به سایت </button>
        </form>

البته اینکار بیشتر با جاوا اسکریپت و تگ a صورت میگیره ولی چون پرسیدی گفتم ...


محمد وزانی
محمد وزانی
تخصص :برنامه نویسی
@mohammad.vzn4 سال پیشمطرح شد
0

سلام عزیز، واقعا عالی توضیح دادین😍👍🏻مرسی از وقتی که بابت توضیح گذاشتید دمتون گرم❤️بله متوجه شدم ممنون از شما👌🏼موفق باشی عزیز💛


محمد ابوالحسنی
محمد ابوالحسنی
تخصص :front end developer
@Kotu.bro4 سال پیشمطرح شد
1

سلام . دوست عزیز باتنی ک شما میسازید داخل html در کل جز مسائلی هست که وقتی روش کلیک میکنید با سرور ارتباط برقرار میکنه . اون چیزی که میخواید شما بسازید که بتونه شما رو به ی صفحه دیگه منتقل کنه شما باید متنتون رو با تگ a بنویسید و بعد بهش بک گراند بدید که شبیه باتن بشه


محمد وزانی
محمد وزانی
تخصص :برنامه نویسی
@mohammad.vzn4 سال پیشمطرح شد
0

یعنی نمیشه دکمه ای ساخت که هم فرم هارو ذخیره کنه و بصورت post یا get ذخیره کنه و بفرسته سمت سرور و هم با زدن اون دکمه کاربر به وبسایت یا صفحه ی دیگه ای هدایت بشه؟ 🤔


مجتبی مسکین
مجتبی مسکین
تخصص :توسعه دهنده وب - فول استک
@mojskin4 سال پیشمطرح شد
1

تگ btn رو میتونی هم داخل فرم بیاری و هم خارج از فرم. درون فرم هم حتی میتونه نوعش رو btn بزاری یا submit که حتی کلیک کردن روی btn در حالت غیر submit هیچ کاری به فرمت نخواهد داشت!

در مورد اینکه با کلیک روی یک btn بتونی به یک لینک بری، میتونی از js و jquery کمک بگیری.
حالت آسون با jquery (البته باید قبلش jquery رو نصب کرده باشی):

<button type="button" data-action="link-btn" data-target="https://google.com">
  Open another link
</button>
<script>
  $(function() {
      $('button[data-action="link-btn"]').on('click', function() {
          document.location.replace($(this).attr('data-target'))
      })
  });
</script>

حالت یک کمی سخت‌تر، با javascript خام که فقط باید بخش کدهای js داخل تگ script رو با این کد تغییر بدی:

window.onload = (event) => {
  let x = document.querySelectorAll('[data-action="link-btn"]')[0] || null
  if (x) {
    x.addEventListener("click", function() {
      document.location.replace(x.getAttribute('data-target'))
    })
  }
};

مجتبی مسکین
مجتبی مسکین
تخصص :توسعه دهنده وب - فول استک
@mojskin4 سال پیشمطرح شد
1

روش کاربردی هست ولی منطقی نیست!


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام