JSFiddle - React, Tailwind, and code Playground

by Emre Erkan

HTML

<input type="text" maxlength="11" />
<input type="button" value="Kontrol et" />
<div class="alert"></div>

CSS

body {
  padding: 20px;
  background: #ffffff;
  font-family: Arial, sans-serif;
}

.alert {
  margin-top: 20px;
  padding: 8px 35px 8px 14px;
  margin-bottom: 18px;
  color: #c09853;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background-color: #fcf8e3;
  border: 1px solid #fbeed5;
  border-radius: 4px;
}

.alert-success {
  color: #468847;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}

.alert-danger,
.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

.alert-info {
  color: #3a87ad;
  background-color: #d9edf7;
  border-color: #bce8f1;
}

input[type="text"] {
  padding: 9px;
  border-radius: 5px;
  border: 1px solid #130269;
  font-size: 14px;
}

input[type="button"] {
  color: #ffffff;
  background-color: #611BBD;
  border: 0;
  padding: 11px;
  border-radius: 5px;
  cursor: pointer;
  font-size: 14px;
  position: relative;
}

input[type="button"]:hover,
input[type="button"]:focus,
input[type="button"]:active {
  color: #ffffff;
  background-color: #49247A;
  border-color: #130269;
}

JavaScript

function tckontrol(tck) {
  if (tck.length != 11) {
    return false;
  } else {
    var t1 = 0;
    for (i = 0; i < 9; i = i + 2) {
      t1 += parseInt(tck.substring(i, i + 1), 10)
    }
    var t2 = 0;
    for (i = 1; i < 8; i = i + 2) {
      t2 += parseInt(tck.substring(i, i + 1), 10)
    }
    var c10 = (10 - (((t1 * 3) + t2) % 10)) % 10;
    var c11 = (10 - ((((t2 + c10) * 3) + t1) % 10)) % 10;
    return tck.substring(9, 11) == c10.toString() + c11.toString();
  }
}
jQuery(function($) {
  $('.alert').hide()
  $(document).on('click', 'input[type="button"]', function(e) {
    e.preventDefault();
    if (tckontrol($('input[type="text"]').val())) {
      $('.alert').hide().removeClass('alert-success alert-error').addClass('alert-success').html('TC Kimlik No geçerli').fadeIn();
    } else {
      $('.alert').hide().removeClass('alert-success alert-error').addClass('alert-error').html('TC Kimlik No geçersiz').fadeIn();
    }
  });
});